/* font */ @font-face { font-family: "Gilroy-B"; src: url('../fonts/Gilroy-Bold.eot'); src: url('../fonts/Gilroy-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Gilroy-Bold.otf') format('opentype'), url('../fonts/Gilroy-Bold.svg'), url('../fonts/Gilroy-Bold.woff') format('woff'), url('../fonts/Gilroy-Bold.ttf') format('truetype'); } @font-face { font-family: "Gilroy-R"; src: url('../fonts/Gilroy-Regular.eot'); src: url('../fonts/Gilroy-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Gilroy-Regular.otf') format('opentype'), url('../fonts/Gilroy-Regular.svg'), url('../fonts/Gilroy-Regular.woff') format('woff'), url('../fonts/Gilroy-Regular.ttf') format('truetype'); } @font-face { font-family: "Montserrat-B"; src: url('../fonts/Montserrat-Bold.eot'); src: url('../fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-Bold.otf') format('opentype'), url('../fonts/Montserrat-Bold.svg'), url('../fonts/Montserrat-Bold.woff') format('woff'), url('../fonts/Montserrat-Bold.ttf') format('truetype'); } @font-face { font-family: "Montserrat-SB"; src: url('../fonts/Montserrat-SemiBold.eot'); src: url('../fonts/Montserrat-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-SemiBold.otf') format('opentype'), url('../fonts/Montserrat-SemiBold.svg'), url('../fonts/Montserrat-SemiBold.woff') format('woff'), url('../fonts/Montserrat-SemiBold.ttf') format('truetype'); } @font-face { font-family: "Montserrat-R"; src: url('../fonts/Montserrat-Regular.eot'); src: url('../fonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-Regular.otf') format('opentype'), url('../fonts/Montserrat-Regular.svg'), url('../fonts/Montserrat-Regular.woff') format('woff'), url('../fonts/Montserrat-Regular.ttf') format('truetype'); } /* body */ html, body { font-family: "Gilroy-R"; font-weight:normal; font-size:16px; text-indent:0; text-align:justify; line-height:24px; width:100%; min-width:1180px; height:100%; margin:0 auto; padding:0; color:#4d4d4d; background:#ffffff; -webkit-text-size-adjust: none; position:relative; } @media all and (max-width: 1200px) { html, body { min-width:1010px; } } @media all and (max-width: 1020px) { html, body { min-width:710px; } } @media all and (max-width: 720px) { html, body { min-width:400px; } } ::-webkit-scrollbar {width:10px; height:10px;} ::-webkit-scrollbar-button {width:0; height:0; background:#ffffff; } ::-webkit-scrollbar-track {background:#ffffff;} ::-webkit-scrollbar-track-piece {background:#ffffff;} ::-webkit-scrollbar-thumb {height:5px; background:#136394;} ::-webkit-scrollbar-corner {background:#ffffff;} ::-webkit-resizer {background:#ffffff;} ::selection {color:#ffffff; background:#136394;} ::-moz-selection {color:#ffffff; background:#136394;} body img {border:none;} a {text-decoration:none;} a:link {color:#4d4d4d;} a:visited {color:#4d4d4d;} a:hover {color:#4d4d4d;} a:active {color:#4d4d4d;} a:hover, a:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .clear {clear:both;} ul { margin:0; padding:0; } ul li { padding:0; margin:0; list-style-type: none; } /* page */ #page { width:100%; max-width:1920px; overflow:hidden; padding:0; margin:0 auto; position: relative; } /* top */ #top-w { width:100%; max-width:1920px; padding:0; margin:0; background:rgba(255,255,255,0.67); position:absolute; top:0; left:auto; z-index:90; } #top { width:1110px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; } #top a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #top h1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } #top p { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } #top p a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:30px; line-height:24px; padding:0 0 0 35px; margin:0; color:#333333; cursor:pointer; display:inline-block; } #top p a::after { content:''; width:22px; height:22px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; position:absolute; top:1px; left:0; z-index:auto; } #top p a:hover { color:#136394; } #top p a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; } #top p a:hover::after, #top p a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } #top p span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:18px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } #top p span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } #top p span:hover, #top p span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .nav { padding:0; margin:35px auto 0 auto; position:relative; text-align:center; display:inline-block; } .nav a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; padding:0; margin:0 5px; color:#103354; cursor:pointer; float:left; } .nav a:hover { opacity:0.5; } .link { width:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:auto; } @media all and (max-width: 1200px) { #top-w { width:100%; max-width:1920px; padding:0; margin:0; background:rgba(255,255,255,0.67); position:absolute; top:0; left:auto; z-index:90; } #top { width:960px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; } #top a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #top h1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } #top p { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } #top p a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; } #top p a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } #top p a:hover { color:#136394; } #top p a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } #top p a:hover::after, #top p a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } #top p span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } #top p span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } #top p span:hover, #top p span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .nav { padding:0; margin:35px auto 0 auto; position:relative; text-align:center; display:inline-block; } .nav a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; padding:0; margin:0 5px; color:#103354; cursor:pointer; float:left; } .nav a:hover { opacity:0.5; } .link { width:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:auto; } } @media all and (max-width: 1020px) { #top-w { width:100%; max-width:1920px; padding:0; margin:0; background:rgba(255,255,255,0.67); position:absolute; top:0; left:auto; z-index:90; } #top { width:660px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; } #top a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #top h1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } #top p { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } #top p a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; } #top p a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } #top p a:hover { color:#136394; } #top p a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } #top p a:hover::after, #top p a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } #top p span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } #top p span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } #top p span:hover, #top p span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .nav { width:660px; padding:0; margin:10px auto 0 auto; position:relative; text-align:center; display:inline-block; } .nav a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; padding:0; margin:0 10px; color:#103354; cursor:pointer; float:none; display:inline-block; } .nav a:hover { opacity:0.5; } .link { width:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:auto; } } .menu-trigger { width:24px; height:20px; padding:0; margin:0; position:absolute; top:calc(50% - 10px); right:0; z-index:auto; cursor:pointer; display:none; transition:all .4s; box-sizing:border-box; } .menu-trigger span { display:inline-block; transition:all .4s; box-sizing:border-box; } .menu-trigger span { position:absolute; left:0; height:2px; background-color:#136394; border-radius:4px; } .menu-trigger span:nth-of-type(1) { width:24px; top:0; } .menu-trigger span:nth-of-type(2) { width:24px; top:9px; } .menu-trigger span:nth-of-type(3) { width:24px; top:18px; } /* menu-trigger animation */ .menu-trigger.active-1 span:nth-of-type(1) { top:-11px; -webkit-transform: translateY(20px) rotate(-45deg); transform: translateY(20px) rotate(-45deg); } .menu-trigger.active-1 span:nth-of-type(2) { width:24px; left:50%; opacity:0; -webkit-animation: active-menu-bar01 .8s forwards; animation: active-menu-bar01 .8s forwards; } @-webkit-keyframes active-menu-bar01 { 100% { height: 0; } } @keyframes active-menu-bar01 { 100% { height: 0; } } .menu-trigger.active-1 span:nth-of-type(3) { width:24px; top:29px; -webkit-transform : translateY(-20px) rotate(45deg); transform : translateY(-20px) rotate(45deg); } @media all and (max-width: 720px) { .menu-trigger { width:24px; height:20px; padding:0; margin:0; position:absolute; top:calc(50% - 10px); right:0; z-index:auto; cursor:pointer; display:block; transition:all .4s; box-sizing:border-box; } #top-w { width:100%; max-width:1920px; padding:0; margin:0; background:rgba(255,255,255,0.98); position:absolute; top:0; left:auto; z-index:90; } #top { width:360px; padding:10px 0 10px 0; margin:0 auto; position:relative; text-align:center; } #top a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #top h1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } .top { width:100%; padding:10px 0 20px 0; margin:0; position:absolute; top:104px; left:0; z-index:auto; text-align:center; background:rgba(255,255,255,0.98); display:none; } .top::after { content:''; width:400px; height:100%; padding:0; margin:0; position:absolute; top:0; left:-400px; z-index:auto; text-align:center; background:rgba(255,255,255,0.98); } .top::before { content:''; width:400px; height:100%; padding:0; margin:0; position:absolute; top:0; right:-400px; z-index:auto; text-align:center; background:rgba(255,255,255,0.98); } #top p { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:20px auto 0 auto; color:#333333; cursor:default; float:none; position:relative; } #top p a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:center; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; position:relative; } #top p a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } #top p a:hover { color:#136394; } #top p a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } #top p a:hover::after, #top p a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } #top p span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } #top p span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } #top p span:hover, #top p span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .nav { width:100%; padding:0; margin:20px auto 0 auto; position:relative; text-align:center; display:inline-block; } .nav a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; width:100%; padding:0; margin:10px 0; color:#103354; cursor:pointer; float:left; display:block; } .nav a:hover { opacity:0.5; } .link { width:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:auto; } } /* box-1 */ #box-1-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg.jpg') no-repeat top center #e8eff2; } #box-1 { width:1110px; padding:220px 0 180px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #box-1 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .box-1 { width:auto; padding:25px 35px 30px 35px; margin:40px 0 0 0; position:relative; text-align:center; background:#fbfbfb; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; display:inline-block; } .box-1::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } #box-1 p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; color:#103354; cursor:default; float:left; } .p1-1 { padding:130px 0 0 0; margin:0 60px 0 0; background:url('../images/2.png') no-repeat 0 0; } .p1-2 { padding:130px 0 0 0; margin:0 60px 0 0; background:url('../images/3.png') no-repeat 0 0; } .p1-3 { padding:130px 0 0 0; margin:0; background:url('../images/4.png') no-repeat 0 0; } #box-1 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:30px; line-height:36px; padding:0; margin:60px 0 0 0; color:#42607a; cursor:default; } .button-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:40px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-1::after { content:''; width:38px; height:38px; padding:0; margin:0; cursor:pointer; background:url('../images/1.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } .button-1:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-1:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-1:hover, .button-1:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .gloss-ww { position:relative; z-index:7; } .gloss-w { width:100%; height:100%; overflow:hidden; padding:0; margin:0; position:absolute; left:0; top:0; border:none; outline:none; z-index:8; display:block; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .gloss-ww:hover .gloss-w { display:none; } .gloss-w:hover, .gloss-w:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .gloss { width:100%; height:100%; padding:0; margin:0; position:absolute; left:-100%; top:0; border:none; outline:none; background:url('../images/gloss.png') no-repeat center center; z-index:9; } @media all and (max-width: 1280px) { #box-1 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-1-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg.jpg') no-repeat top center #e8eff2; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-1 { width:960px; padding:210px 0 140px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #box-1 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-1 { width:auto; padding:20px 30px 25px 30px; margin:40px 0 0 0; position:relative; text-align:center; background:#fbfbfb; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; display:inline-block; } .box-1::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } #box-1 p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; color:#103354; cursor:default; float:left; } .p1-1 { padding:130px 0 0 0; margin:0 60px 0 0; background:url('../images/2.png') no-repeat 0 0; } .p1-2 { padding:130px 0 0 0; margin:0 60px 0 0; background:url('../images/3.png') no-repeat 0 0; } .p1-3 { padding:130px 0 0 0; margin:0; background:url('../images/4.png') no-repeat 0 0; } #box-1 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:26px; line-height:32px; padding:0; margin:60px 0 0 0; color:#42607a; cursor:default; } .button-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:40px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-1::after { content:''; width:38px; height:38px; padding:0; margin:0; cursor:pointer; background:url('../images/1.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } .button-1:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-1:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-1:hover, .button-1:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-1-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg.jpg') no-repeat top center #e8eff2; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-1-w::after { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:1; background:#e8eff2; opacity:0.75; } #box-1 { width:660px; padding:235px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-1 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-1 { width:auto; padding:20px 30px 25px 30px; margin:40px auto 0 auto; position:relative; text-align:center; background:#fbfbfb; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; display:inline-block; } .box-1::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } #box-1 p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; color:#103354; cursor:default; float:none; display:inline-block; } .p1-1 { padding:130px 0 0 0; margin:0 40px 0 0; background:url('../images/2.png') no-repeat top center; } .p1-2 { padding:130px 0 0 0; margin:0 40px 0 0; background:url('../images/3.png') no-repeat top center; } .p1-3 { padding:130px 0 0 0; margin:0; background:url('../images/4.png') no-repeat top center; } #box-1 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:26px; line-height:32px; padding:0; margin:60px 0 0 0; color:#42607a; cursor:default; } .button-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:40px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-1::after { content:''; width:38px; height:38px; padding:0; margin:0; cursor:pointer; background:url('../images/1.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } .button-1:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-1:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-1:hover, .button-1:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-1-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg1.jpg') no-repeat top center #e8eff2; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-1-w::after { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; top:0; left:0; z-index:1; background:#e8eff2; opacity:0.75; } #box-1 { width:360px; padding:164px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-1 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } .box-1 { width:100%; padding:20px 0 25px 0; margin:30px auto 0 auto; position:relative; text-align:center; background:rgba(255,255,255,0.7); border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; display:inline-block; } .box-1::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; opacity:0.7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; } #box-1 p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; width:100%; font-size:18px; line-height:24px; color:#103354; cursor:default; float:none; display:inline-block; } .p1-1 { padding:120px 0 0 0; margin:0; background:url('../images/2.png') no-repeat top center; } .p1-2 { padding:120px 0 0 0; margin:20px 0 0 0; background:url('../images/3.png') no-repeat top center; } .p1-3 { padding:130px 0 0 0; margin:20px 0 0 0; background:url('../images/4.png') no-repeat top center; } #box-1 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:22px; line-height:26px; padding:0; margin:50px 0 0 0; color:#42607a; cursor:default; } #box-1 h4 br { display:none; } .button-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-1::after { content:''; width:38px; height:38px; padding:0; margin:0; cursor:pointer; background:url('../images/1.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:30px; z-index:auto; } .button-1:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-1:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-1:hover, .button-1:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-2 */ #box-2-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg2.jpg') no-repeat top center #eff7fd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img2-1 { width:663px; height:1304px; padding:0; margin:0; background:url('../images/10.png') no-repeat top center; position:absolute; top:90px; left:calc(50% - 890px); z-index:3; } .img2-2 { width:222px; height:60px; padding:0; margin:0; background:url('../images/11.png') no-repeat top center; position:absolute; top:160px; right:calc(50% - 885px); z-index:3; } #box-2 { width:810px; padding:95px 0 100px 430px; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-2 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .p2-1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0 0 0 80px; margin:60px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .p2-1::after { content:''; width:50px; height:50px; padding:0; margin:0; background:url('../images/5.svg') no-repeat center 19px #136394; position:absolute; top:calc(50% - 27px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .p2-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:24px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } #box-2 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:70px 0 0 0; color:#136394; cursor:default; } .p2-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:14px; line-height:18px; width:234px; min-height:130px; padding:260px 0 0 0; color:#f5f5f5; cursor:default; position:relative; float:left; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2-1 { margin:30px 0 0 0; background:url('../images/7.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-2 { margin:30px 20px 0 20px; background:url('../images/8.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-3 { margin:30px 0 0 0; background:url('../images/9.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .sp2-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:18px; padding:0; margin:0 0 20px 0; color:#f5f5f5; cursor:default; position:relative; z-index:10; display:inline-block; } .sp2-1::after { content:''; width:34px; height:4px; padding:0; background:#f5f5f5; cursor:default; position:absolute; left:calc(50% - 17px); bottom:-10px; z-index:auto; } .sp2-2 { position:relative; z-index:10; } .p2-2::before { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:6; background:url('../images/shadow.png') repeat-x bottom center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2::after { content:''; width:calc(100% - 30px); height:100%; padding:0; margin:0; background:#4d4d4d; position:absolute; left:15px; bottom:-5px; z-index:-1; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-2 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .button-2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:30px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-2::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-2:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-2:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-2:hover, .button-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { .img2-2 { width:222px; height:60px; padding:0; margin:0; background:url('../images/11.png') no-repeat top center; position:absolute; top:160px; right:calc(50% - 585px); z-index:3; } #box-2 { width:780px; padding:95px 0 100px 370px; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-2 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-2-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg2.jpg') no-repeat top center #eff7fd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img2-1 { width:400px; height:1304px; padding:0; margin:0; background:url('../images/10.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:90px; left:calc(50% - 600px); z-index:3; } .img2-2 { width:222px; height:60px; padding:0; margin:0; background:url('../images/11.png') no-repeat top center; position:absolute; top:160px; right:calc(50% - 480px); z-index:3; } #box-2 { width:680px; padding:85px 0 90px 280px; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-2 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 60px 0; color:#136394; cursor:default; } .p2-1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 60px; margin:35px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .p2-1::after { content:''; width:40px; height:40px; padding:0; margin:0; background:url('../images/5.svg') no-repeat center 14px #136394; -webkit-background-size: 18px auto; -moz-background-size: 18px auto; -o-background-size: 18px auto; background-size: 18px auto; position:absolute; top:calc(50% - 27px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .p2-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } #box-2 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:22px; line-height:28px; padding:0; margin:60px 0 0 0; color:#136394; cursor:default; } .p2-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:14px; line-height:18px; width:220px; min-height:130px; padding:260px 0 0 0; color:#f5f5f5; cursor:default; position:relative; float:left; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2-1 { margin:30px 0 0 0; background:url('../images/7.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-2 { margin:30px 10px 0 10px; background:url('../images/8.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-3 { margin:30px 0 0 0; background:url('../images/9.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .sp2-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:18px; padding:0; margin:0 0 20px 0; color:#f5f5f5; cursor:default; position:relative; z-index:10; display:inline-block; } .sp2-1::after { content:''; width:34px; height:4px; padding:0; background:#f5f5f5; cursor:default; position:absolute; left:calc(50% - 17px); bottom:-10px; z-index:auto; } .sp2-2 { position:relative; z-index:10; } .p2-2::before { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:6; background:url('../images/shadow.png') repeat-x bottom center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2::after { content:''; width:calc(100% - 30px); height:100%; padding:0; margin:0; background:#4d4d4d; position:absolute; left:15px; bottom:-5px; z-index:-1; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-2 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .button-2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:30px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-2::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-2:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-2:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-2:hover, .button-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-2-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg2.jpg') no-repeat top center #eff7fd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img2-1 { width:250px; height:510px; padding:0; margin:0; background:url('../images/10.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:220px; left:calc(50% - 450px); z-index:3; opacity:0.45; } .img2-2 { width:222px; height:60px; padding:0; margin:0; background:url('../images/11.png') no-repeat top center; position:absolute; top:180px; right:calc(50% - 380px); z-index:3; } #box-2 { width:660px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-2 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 60px 0; color:#136394; cursor:default; } #box-2 h2 br { display:none; } .p2-1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:19px; line-height:26px; padding:0 0 0 60px; margin:35px 0 0 140px; color:#4d4d4d; cursor:default; position:relative; } .p2-1::after { content:''; width:40px; height:40px; padding:0; margin:0; background:url('../images/5.svg') no-repeat center 14px #136394; -webkit-background-size: 18px auto; -moz-background-size: 18px auto; -o-background-size: 18px auto; background-size: 18px auto; position:absolute; top:calc(50% - 27px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .p2-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:19px; line-height:19px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } #box-2 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:22px; line-height:28px; padding:0; margin:60px 0 0 0; color:#136394; cursor:default; } .p2-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:13px; line-height:18px; width:210px; min-height:130px; padding:260px 0 0 0; color:#f5f5f5; cursor:default; position:relative; float:left; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2-1 { margin:30px 0 0 0; background:url('../images/7.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-2 { margin:30px 15px 0 15px; background:url('../images/8.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-3 { margin:30px 0 0 0; background:url('../images/9.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .sp2-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:13px; line-height:18px; padding:0 5px; margin:0 0 20px 0; color:#f5f5f5; cursor:default; position:relative; z-index:10; display:inline-block; } .sp2-1::after { content:''; width:34px; height:4px; padding:0; background:#f5f5f5; cursor:default; position:absolute; left:calc(50% - 17px); bottom:-10px; z-index:auto; } .sp2-2 { position:relative; z-index:10; } .p2-2::before { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:6; background:url('../images/shadow.png') repeat-x bottom center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2::after { content:''; width:calc(100% - 30px); height:100%; padding:0; margin:0; background:#4d4d4d; position:absolute; left:15px; bottom:-5px; z-index:-1; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-2 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .button-2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-2::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-2:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-2:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-2:hover, .button-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-2-w { width:100%; padding:0; margin:0; position:relative; background:#eff7fd; } .img2-1 { width:200px; height:510px; padding:0; margin:0; background:url('../images/10.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:220px; left:calc(50% - 350px); z-index:3; opacity:0.45; display:none; } .img2-2 { width:170px; height:60px; padding:0; margin:0; background:url('../images/11.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:170px; right:calc(50% - 240px); z-index:3; } #box-2 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-2 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; max-width:330px; padding:0; margin:0 auto 50px auto; color:#136394; cursor:default; } #box-2 h2 br { display:block; } .p2-1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0 0 0 60px; margin:20px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .p2-1::after { content:''; width:40px; height:40px; padding:0; margin:0; background:url('../images/5.svg') no-repeat center 14px #136394; -webkit-background-size: 18px auto; -moz-background-size: 18px auto; -o-background-size: 18px auto; background-size: 18px auto; position:absolute; top:3px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .p2-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:18px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline; cursor:default; } .p2-1 br { display:none; } #box-2 h3 br { display:none; } #box-2 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:18px; line-height:24px; padding:0; margin:50px 0 0 0; color:#136394; cursor:default; } .p2-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:14px; line-height:18px; width:280px; min-height:130px; padding:260px 0 0 0; color:#f5f5f5; cursor:default; position:relative; float:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2-1 { margin:30px auto 0 auto; background:url('../images/7.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-2 { margin:30px auto 0 auto; background:url('../images/8.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .p2-2-3 { margin:30px auto 0 auto; background:url('../images/9.jpg') no-repeat center center #4d4d4d; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .sp2-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:18px; padding:0 5px; margin:0 0 20px 0; color:#f5f5f5; cursor:default; position:relative; z-index:10; display:inline-block; } .sp2-1::after { content:''; width:34px; height:4px; padding:0; background:#f5f5f5; cursor:default; position:absolute; left:calc(50% - 17px); bottom:-10px; z-index:auto; } .sp2-2 { position:relative; z-index:10; } .p2-2::before { content:''; width:100%; height:100%; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:6; background:url('../images/shadow.png') repeat-x bottom center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .p2-2::after { content:''; width:calc(100% - 30px); height:100%; padding:0; margin:0; background:#4d4d4d; position:absolute; left:15px; bottom:-5px; z-index:-1; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-2 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .button-2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-2::after { content:''; width:30px; height:30px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 15px); right:30px; z-index:auto; } .button-2:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-2:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-2:hover, .button-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-3 */ #box-3-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg3.jpg') no-repeat top center #f8f8f7; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; z-index:2; } .img3-1 { width:272px; height:355px; padding:0; margin:0; background:url('../images/16.png') no-repeat top center; position:absolute; top:70px; left:calc(50% - 860px); z-index:3; } .img3-2 { width:567px; height:348px; padding:0; margin:0; background:url('../images/17.png') no-repeat top center; position:absolute; right:calc(50% - 910px); bottom:0; z-index:3; } #box-3 { width:1110px; padding:95px 0 0 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-3 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .box-3 { width:100%; height:930px; padding:0; margin:90px 0 0 0; position:relative; text-align:center; } .box-3::after { content:''; width:896px; height:896px; padding:0; margin:0; border:2px solid #b2b2b2; position:absolute; left:calc(50% - 450px); bottom:35px; z-index:6; opacity:0.21; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .img3-3 { width:233px; height:165px; padding:0; margin:0; background:url('../images/15.png') no-repeat bottom center; position:absolute; left:calc(50% - 240px); bottom:600px; z-index:7; } .img3-4 { width:420px; height:873px; padding:0; margin:0; background:url('../images/14.png') no-repeat bottom center; position:absolute; left:calc(50% - 210px); bottom:0; z-index:8; } .img3-5 { width:258px; height:165px; padding:0; margin:0; background:url('../images/13.png') no-repeat bottom center; position:absolute; left:calc(50% - 15px); bottom:380px; z-index:9; } #box-3 p { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; width:290px; height:110px; padding:25px 0 0 0; margin:0; color:#f5f5f5; cursor:default; background-image: linear-gradient(to bottom, #40434c, #282b34); background-image: -webkit-linear-gradient(to bottom, #40434c, #282b34); background-image: -moz-linear-gradient(to bottom, #40434c, #282b34); background-image: -o-linear-gradient(to bottom, #40434c, #282b34); background-image: -ms-linear-gradient(to bottom, #40434c, #282b34); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; z-index:15; } .p3-1 { top:35px; left:60px; } .p3-2 { top:35px; right:120px; } .p3-3 { top:300px; right:0; } .p3-4 { top:580px; right:50px; } .p3-5 { top:580px; left:50px; } .p3-6 { top:300px; left:0; } #box-3 p::after { content:''; width:calc(100% - 12px); height:calc(100% - 16px); padding:0; margin:0; border-top:10px solid #424650; border-left:6px solid #424650; border-right:6px solid #424650; border-bottom:6px solid #424650; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; top:0; left:0; z-index:auto; } .sp3-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:14px; padding:0 0 0 25px; margin:0; color:#79808d; cursor:default; display:inline-block; position:relative; } .sp3-1::after { content:''; width:16px; height:16px; padding:0; margin:0; cursor:default; background:url('../images/12.svg') no-repeat center 6px #335fe2; position:absolute; top:calc(50% - 8px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .sp3-2 { width:calc(100% - 22px); padding:14px 0 0 0; margin:14px auto 0 auto; border-top:1px solid #6c707d; cursor:default; display:inline-block; position:relative; } .sp3-3 { font-family: "Montserrat-B"; font-weight:normal; } .button-3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; left:calc(50% - 235px); bottom:-45px; z-index:10; } .button-3::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-3:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-3:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-3:hover, .button-3:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { #box-3 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-3-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg3.jpg') no-repeat top center #f8f8f7; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; z-index:2; } .img3-1 { width:200px; height:355px; padding:0; margin:0; background:url('../images/16.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:70px; left:calc(50% - 630px); z-index:3; } .img3-2 { width:500px; height:348px; padding:0; margin:0; background:url('../images/17.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 760px); bottom:0; z-index:3; } #box-3 { width:960px; padding:85px 0 0 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-3 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-3 { width:100%; height:930px; padding:0; margin:90px 0 0 0; position:relative; text-align:center; } .box-3::after { content:''; width:896px; height:896px; padding:0; margin:0; border:2px solid #b2b2b2; position:absolute; left:calc(50% - 450px); bottom:35px; z-index:6; opacity:0.21; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .img3-3 { width:233px; height:165px; padding:0; margin:0; background:url('../images/15.png') no-repeat bottom center; position:absolute; left:calc(50% - 240px); bottom:600px; z-index:7; } .img3-4 { width:420px; height:873px; padding:0; margin:0; background:url('../images/14.png') no-repeat bottom center; position:absolute; left:calc(50% - 210px); bottom:0; z-index:8; } .img3-5 { width:258px; height:165px; padding:0; margin:0; background:url('../images/13.png') no-repeat bottom center; position:absolute; left:calc(50% - 15px); bottom:380px; z-index:9; } #box-3 p { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; width:290px; height:110px; padding:25px 0 0 0; margin:0; color:#f5f5f5; cursor:default; background-image: linear-gradient(to bottom, #40434c, #282b34); background-image: -webkit-linear-gradient(to bottom, #40434c, #282b34); background-image: -moz-linear-gradient(to bottom, #40434c, #282b34); background-image: -o-linear-gradient(to bottom, #40434c, #282b34); background-image: -ms-linear-gradient(to bottom, #40434c, #282b34); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; z-index:15; } .p3-1 { top:35px; left:60px; } .p3-2 { top:35px; right:80px; } .p3-3 { top:300px; right:0; } .p3-4 { top:580px; right:50px; } .p3-5 { top:580px; left:50px; } .p3-6 { top:300px; left:0; } #box-3 p::after { content:''; width:calc(100% - 12px); height:calc(100% - 16px); padding:0; margin:0; border-top:10px solid #424650; border-left:6px solid #424650; border-right:6px solid #424650; border-bottom:6px solid #424650; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; top:0; left:0; z-index:auto; } .sp3-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:14px; padding:0 0 0 25px; margin:0; color:#79808d; cursor:default; display:inline-block; position:relative; } .sp3-1::after { content:''; width:16px; height:16px; padding:0; margin:0; cursor:default; background:url('../images/12.svg') no-repeat center 6px #335fe2; position:absolute; top:calc(50% - 8px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .sp3-2 { width:calc(100% - 22px); padding:14px 0 0 0; margin:14px auto 0 auto; border-top:1px solid #6c707d; cursor:default; display:inline-block; position:relative; } .sp3-3 { font-family: "Montserrat-B"; font-weight:normal; } .button-3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; left:calc(50% - 215px); bottom:-45px; z-index:10; } .button-3::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-3:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-3:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-3:hover, .button-3:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-3-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg3.jpg') no-repeat top center #f8f8f7; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; z-index:2; } .img3-1 { width:200px; height:300px; padding:0; margin:0; background:url('../images/16.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:auto; bottom:100px; left:calc(50% - 370px); z-index:3; } .img3-2 { width:500px; height:348px; padding:0; margin:0; background:url('../images/17.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 520px); bottom:0; z-index:3; } #box-3 { width:660px; padding:85px 0 0 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-3 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #box-3 h2 br { display:none; } .box-3 { width:100%; height:auto; padding:0 0 700px 0; margin:30px 0 0 0; position:relative; text-align:center; } .box-3::after { content:''; width:896px; height:896px; padding:0; margin:0; border:2px solid #b2b2b2; position:absolute; left:calc(50% - 450px); bottom:35px; z-index:6; opacity:0.21; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; display:none; } .img3-3 { width:233px; height:165px; padding:0; margin:0; background:url('../images/15.png') no-repeat bottom center; position:absolute; left:calc(50% - 240px); bottom:400px; z-index:7; } .img3-4 { width:300px; height:640px; padding:0; margin:0; background:url('../images/14.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:calc(50% - 150px); bottom:0; z-index:8; } .img3-5 { width:258px; height:165px; padding:0; margin:0; background:url('../images/13.png') no-repeat bottom center; position:absolute; left:calc(50% - 15px); bottom:180px; z-index:9; } #box-3 p { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; width:310px; height:110px; padding:25px 0 0 0; margin:40px 0 0 0; color:#f5f5f5; cursor:default; background-image: linear-gradient(to bottom, #40434c, #282b34); background-image: -webkit-linear-gradient(to bottom, #40434c, #282b34); background-image: -moz-linear-gradient(to bottom, #40434c, #282b34); background-image: -o-linear-gradient(to bottom, #40434c, #282b34); background-image: -ms-linear-gradient(to bottom, #40434c, #282b34); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:15; } .p3-1 { top:auto; left:auto; float:left; } .p3-2 { top:auto; right:auto; float:right; } .p3-3 { top:auto; right:auto; float:left; } .p3-4 { top:auto; right:auto; float:right; } .p3-5 { top:auto; left:auto; float:left; } .p3-6 { top:auto; left:auto; float:right; } #box-3 p::after { content:''; width:calc(100% - 12px); height:calc(100% - 16px); padding:0; margin:0; border-top:10px solid #424650; border-left:6px solid #424650; border-right:6px solid #424650; border-bottom:6px solid #424650; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; top:0; left:0; z-index:auto; } .sp3-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:14px; padding:0 0 0 25px; margin:0; color:#79808d; cursor:default; display:inline-block; position:relative; } .sp3-1::after { content:''; width:16px; height:16px; padding:0; margin:0; cursor:default; background:url('../images/12.svg') no-repeat center 6px #335fe2; position:absolute; top:calc(50% - 8px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .sp3-2 { width:calc(100% - 22px); padding:14px 0 0 0; margin:14px auto 0 auto; border-top:1px solid #6c707d; cursor:default; display:inline-block; position:relative; } .sp3-3 { font-family: "Montserrat-B"; font-weight:normal; } .button-3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; left:calc(50% - 215px); bottom:-45px; z-index:10; } .button-3::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-3:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-3:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-3:hover, .button-3:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-3-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; z-index:2; } .img3-1 { width:100px; height:150px; padding:0; margin:0; background:url('../images/16.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:auto; bottom:100px; left:calc(50% - 240px); z-index:3; } .img3-2 { width:250px; height:348px; padding:0; margin:0; background:url('../images/17.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 320px); bottom:0; z-index:3; } #box-3 { width:360px; padding:65px 0 0 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-3 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } #box-3 h2 br { display:none; } .box-3 { width:100%; height:auto; padding:0 0 450px 0; margin:50px 0 0 0; position:relative; text-align:center; } .box-3::after { content:''; width:896px; height:896px; padding:0; margin:0; border:2px solid #b2b2b2; position:absolute; left:calc(50% - 450px); bottom:35px; z-index:6; opacity:0.21; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; display:none; } .img3-3 { width:160px; height:165px; padding:0; margin:0; background:url('../images/15.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:calc(50% - 160px); bottom:270px; z-index:7; } .img3-4 { width:200px; height:420px; padding:0; margin:0; background:url('../images/14.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:calc(50% - 100px); bottom:0; z-index:8; } .img3-5 { width:180px; height:165px; padding:0; margin:0; background:url('../images/13.png') no-repeat bottom center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:calc(50% - 25px); bottom:130px; z-index:9; } #box-3 p { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:20px; width:100%; height:110px; padding:25px 0 0 0; margin:10px 0 0 0; color:#f5f5f5; cursor:default; background-image: linear-gradient(to bottom, #40434c, #282b34); background-image: -webkit-linear-gradient(to bottom, #40434c, #282b34); background-image: -moz-linear-gradient(to bottom, #40434c, #282b34); background-image: -o-linear-gradient(to bottom, #40434c, #282b34); background-image: -ms-linear-gradient(to bottom, #40434c, #282b34); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:15; } .p3-1 { top:auto; left:auto; float:left; } .p3-2 { top:auto; right:auto; float:right; } .p3-3 { top:auto; right:auto; float:left; } .p3-4 { top:auto; right:auto; float:right; } .p3-5 { top:auto; left:auto; float:left; } .p3-6 { top:auto; left:auto; float:right; } #box-3 p::after { content:''; width:calc(100% - 12px); height:calc(100% - 16px); padding:0; margin:0; border-top:10px solid #424650; border-left:6px solid #424650; border-right:6px solid #424650; border-bottom:6px solid #424650; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; top:0; left:0; z-index:auto; } .sp3-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:14px; line-height:14px; padding:0 0 0 25px; margin:0; color:#79808d; cursor:default; display:inline-block; position:relative; } .sp3-1::after { content:''; width:16px; height:16px; padding:0; margin:0; cursor:default; background:url('../images/12.svg') no-repeat center 6px #335fe2; position:absolute; top:calc(50% - 8px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .sp3-2 { width:calc(100% - 22px); padding:14px 0 0 0; margin:14px auto 0 auto; border-top:1px solid #6c707d; cursor:default; display:inline-block; position:relative; } .sp3-3 { font-family: "Montserrat-B"; font-weight:normal; } .button-3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:absolute; left:calc(50% - 180px); bottom:-40px; z-index:10; } .button-3::after { content:''; width:30px; height:30px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 15px); right:30px; z-index:auto; } .button-3:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-3:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-3:hover, .button-3:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-4 */ #box-4-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; z-index:1; } #box-4 { width:1110px; padding:135px 0 110px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-4 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .box-4 { width:290px; padding:30px 30px 40px 30px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-4-1 { margin:70px 0 0 0; } .box-4-2 { margin:110px 30px 0 30px; } .box-4-3 { margin:70px 0 0 0; } .box-4::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-4 img { height:126px; padding:0; margin:0 auto; display:block; } #box-4 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:25px 0 0 0; color:#136394; cursor:default; } #box-4 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:30px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } @media all and (max-width: 1280px) { #box-4 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-4-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; z-index:1; } #box-4 { width:960px; padding:125px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-4 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-4 { width:270px; padding:30px 20px 40px 20px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-4-1 { margin:70px 0 0 0; } .box-4-2 { margin:110px 15px 0 15px; } .box-4-3 { margin:70px 0 0 0; } .box-4::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-4 img { height:126px; padding:0; margin:0 auto; display:block; } #box-4 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:25px 0 0 0; color:#136394; cursor:default; } #box-4 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } @media all and (max-width: 1020px) { #box-4-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; z-index:1; } #box-4 { width:660px; padding:125px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-4 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 auto; max-width:580px; color:#136394; cursor:default; } .box-4 { width:calc(100% - 40px); padding:30px 20px 40px 20px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-4-1 { margin:70px 0 0 0; } .box-4-2 { margin:40px 0 0 0; } .box-4-3 { margin:40px 0 0 0; } .box-4::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-4 img { height:126px; padding:0; margin:0 auto; display:block; } #box-4 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:25px 0 0 0; color:#136394; cursor:default; } #box-4 h3 br { display:none; } #box-4 p br { display:none; } #box-4 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } @media all and (max-width: 720px) { #box-4-w { width:100%; padding:0; margin:0; position:relative; background:#f5f5f5; z-index:1; } #box-4 { width:360px; padding:105px 0 80px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-4 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 auto; max-width:580px; color:#136394; cursor:default; } .box-4 { width:calc(100% - 40px); padding:30px 20px 40px 20px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-4-1 { margin:50px 0 0 0; } .box-4-2 { margin:30px 0 0 0; } .box-4-3 { margin:30px 0 0 0; } .box-4::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-4 img { height:126px; padding:0; margin:0 auto; display:block; } #box-4 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:25px 0 0 0; color:#136394; cursor:default; } #box-4 h3 br { display:block; } #box-4 p br { display:block; } #box-4 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } /* box-5 */ #box-5-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg4.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-5 { width:1110px; padding:95px 0 120px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-5 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .video-5-w { width:840px; height:540px; padding:0; margin:70px auto 0 auto; position:relative; text-align:center; } .video-5-w::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .video-5-w::before { content:''; width:384px; height:570px; padding:0; margin:0; position:absolute; top:-35px; left:-210px; z-index:-2; background:url('../images/22.png') no-repeat top center; } .video-5 { width:840px; height:540px; padding:0; margin:0; background:url('../images/21.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-5 .play-w { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 50px); left:calc(50% - 50px); z-index:30; } #box-5 .play { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-5 .play::before { content:''; width:34px; height:40px; padding:0; margin:0; position:absolute; top:calc(50% - 20px); left:calc(50% - 14px); z-index:11; background:url('../images/play.svg') no-repeat center center; cursor:pointer; } #box-5 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-5 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-5 .pulse-1 { width:132px; height:132px; border:4px solid #136394; padding:0; margin:-66px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-5 .pulse-1::after { content:''; width:132px; height:132px; border:4px solid #5197c1; padding:0; margin:-74px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-5 .pulse-2 { width:166px; height:166px; border:2px solid #136394; padding:0; margin:-83px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-5 .pulse-2::after { content:''; width:166px; height:166px; border:2px solid #5197c1; padding:0; margin:-87px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } @media all and (max-width: 1280px) { #box-5 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-5-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg4.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-5 { width:960px; padding:85px 0 110px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-5 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .video-5-w { width:840px; height:540px; padding:0; margin:60px auto 0 auto; position:relative; text-align:center; } .video-5-w::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .video-5-w::before { content:''; width:384px; height:570px; padding:0; margin:0; position:absolute; top:-35px; left:-210px; z-index:-2; background:url('../images/22.png') no-repeat top center; } .video-5 { width:840px; height:540px; padding:0; margin:0; background:url('../images/21.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-5 .play-w { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 50px); left:calc(50% - 50px); z-index:30; } #box-5 .play { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-5 .play::before { content:''; width:34px; height:40px; padding:0; margin:0; position:absolute; top:calc(50% - 20px); left:calc(50% - 14px); z-index:11; background:url('../images/play.svg') no-repeat center center; cursor:pointer; } #box-5 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-5 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-5 .pulse-1 { width:132px; height:132px; border:4px solid #136394; padding:0; margin:-66px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-5 .pulse-1::after { content:''; width:132px; height:132px; border:4px solid #5197c1; padding:0; margin:-74px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-5 .pulse-2 { width:166px; height:166px; border:2px solid #136394; padding:0; margin:-83px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-5 .pulse-2::after { content:''; width:166px; height:166px; border:2px solid #5197c1; padding:0; margin:-87px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } @media all and (max-width: 1020px) { #box-5-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg4.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-5 { width:660px; padding:85px 0 110px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-5 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .video-5-w { width:540px; height:340px; padding:0; margin:60px 0 0 120px; position:relative; text-align:center; } .video-5-w::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .video-5-w::before { content:''; width:284px; height:470px; padding:0; margin:0; position:absolute; top:-35px; left:-150px; z-index:-2; background:url('../images/22.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } .video-5 { width:540px; height:340px; padding:0; margin:0; background:url('../images/21.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-5 .play-w { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 50px); left:calc(50% - 50px); z-index:30; } #box-5 .play { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-5 .play::before { content:''; width:34px; height:40px; padding:0; margin:0; position:absolute; top:calc(50% - 20px); left:calc(50% - 14px); z-index:11; background:url('../images/play.svg') no-repeat center center; cursor:pointer; } #box-5 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-5 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-5 .pulse-1 { width:132px; height:132px; border:4px solid #136394; padding:0; margin:-66px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-5 .pulse-1::after { content:''; width:132px; height:132px; border:4px solid #5197c1; padding:0; margin:-74px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-5 .pulse-2 { width:166px; height:166px; border:2px solid #136394; padding:0; margin:-83px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-5 .pulse-2::after { content:''; width:166px; height:166px; border:2px solid #5197c1; padding:0; margin:-87px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } @media all and (max-width: 720px) { #box-5-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-5 { width:360px; padding:65px 0 80px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-5 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } .video-5-w { width:300px; height:240px; padding:0; margin:60px 0 0 60px; position:relative; text-align:center; } .video-5-w::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#f1f1f1; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .video-5-w::before { content:''; width:200px; height:300px; padding:0; margin:0; position:absolute; top:-35px; left:-120px; z-index:-2; background:url('../images/22.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } .video-5 { width:300px; height:240px; padding:0; margin:0; background:url('../images/21.jpg') no-repeat top center #f0eeef; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #box-5 .play-w { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 50px); left:calc(50% - 50px); z-index:30; } #box-5 .play { width:100px; height:100px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-5 .play::before { content:''; width:34px; height:40px; padding:0; margin:0; position:absolute; top:calc(50% - 20px); left:calc(50% - 14px); z-index:11; background:url('../images/play.svg') no-repeat center center; cursor:pointer; } #box-5 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-5 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-5 .pulse-1 { width:132px; height:132px; border:4px solid #136394; padding:0; margin:-66px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-5 .pulse-1::after { content:''; width:132px; height:132px; border:4px solid #5197c1; padding:0; margin:-74px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-5 .pulse-2 { width:166px; height:166px; border:2px solid #136394; padding:0; margin:-83px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-5 .pulse-2::after { content:''; width:166px; height:166px; border:2px solid #5197c1; padding:0; margin:-87px 0 0 -85px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } /* box-6 */ #box-6-w { width:100%; padding:0; margin:0; position:relative; background:#f4f4f4; } #box-6 { width:1110px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-6 img { width:1014px; padding:0; margin:0; display:block; position:absolute; top:-130px; left:calc(50% - 15px); z-index:auto; } #box-6 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } #box-6 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:60px 0 30px 0; color:#136394; cursor:default; position:relative; } #box-6 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0 0 0 45px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } #box-6 p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:calc(50% - 12px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .button-6 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:60px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-6::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-6:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-6:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-6:hover, .button-6:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { #box-6 img { width:1014px; padding:0; margin:0; display:block; position:absolute; top:-130px; left:calc(50% - 65px); z-index:auto; } #box-6 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } } @media all and (max-width: 1200px) { #box-6-w { width:100%; padding:0; margin:0; position:relative; background:#f4f4f4; } #box-6 { width:960px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-6 img { width:900px; padding:0; margin:0; display:block; position:absolute; top:-110px; left:calc(50% - 85px); z-index:auto; } #box-6 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } #box-6 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:22px; line-height:30px; padding:0; margin:50px 0 20px 0; color:#136394; cursor:default; position:relative; } #box-6 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 45px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } #box-6 p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:calc(50% - 12px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .button-6 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:60px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-6::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-6:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-6:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-6:hover, .button-6:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-6-w { width:100%; padding:0; margin:0; position:relative; background:#f4f4f4; } #box-6 { width:660px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-6 img { width:400px; padding:0; margin:0 auto 0 auto; display:block; position:relative; top:auto; left:auto; z-index:auto; } #box-6 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } #box-6 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:22px; line-height:30px; padding:0; margin:50px 0 20px 0; color:#136394; cursor:default; position:relative; } #box-6 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; width:520px; display:inline-block; padding:0 0 0 35px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } #box-6 p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:calc(50% - 12px); left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .button-6 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:40px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-6::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-6:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-6:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-6:hover, .button-6:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-6-w { width:100%; padding:0; margin:0; position:relative; background:#f4f4f4; } #box-6 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-6 img { width:100%; padding:0; margin:0 auto 0 auto; display:block; position:relative; top:auto; left:auto; z-index:auto; } #box-6 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:26px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } #box-6 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:22px; line-height:30px; padding:0; margin:30px 0 20px 0; color:#136394; cursor:default; position:relative; } #box-6 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; width:auto; display:inline-block; padding:0 0 0 40px; margin:10px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } #box-6 p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:2px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .button-6 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-6::after { content:''; width:30px; height:30px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 15px); right:30px; z-index:auto; } .button-6:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-6:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-6:hover, .button-6:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-7 */ #box-7-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-7 { width:1140px; padding:95px 0 110px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-7 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } .box-7 { width:290px; padding:40px 30px 40px 30px; margin:50px 15px 0 15px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-7::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-7 img { width:239px; padding:0; margin:0 auto; display:block; } #box-7 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:20px 0 0 0; color:#136394; cursor:default; } #box-7 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } #box-7 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:18px; padding:0; margin:10px auto 0 auto; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } .button-7 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:52px; width:100%; height:50px; padding:0; margin:20px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-7:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-7:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-7:hover, .button-7:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { #box-7 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-7-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-7 { width:990px; padding:85px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-7 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } .box-7 { width:290px; padding:30px 10px 30px 10px; margin:40px 10px 0 10px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-7::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-7 img { width:239px; padding:0; margin:0 auto; display:block; } #box-7 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:20px 0 0 0; color:#136394; cursor:default; } #box-7 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:23px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } #box-7 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:17px; padding:0; margin:10px auto 0 auto; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } .button-7 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:52px; width:calc(100% - 20px); height:50px; padding:0; margin:20px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-7:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-7:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-7:hover, .button-7:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-7-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-7 { width:660px; padding:85px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-7 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } .box-7 { width:290px; padding:30px 10px 30px 10px; margin:40px 10px 0 10px; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-7::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-7 img { width:239px; padding:0; margin:0 auto; display:block; } #box-7 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:20px 0 0 0; color:#136394; cursor:default; } #box-7 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:23px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } #box-7 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:17px; padding:0; margin:10px auto 0 auto; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } .button-7 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:52px; width:calc(100% - 20px); height:50px; padding:0; margin:20px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-7:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-7:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-7:hover, .button-7:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-7-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-7 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-7 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } .box-7 { width:320px; padding:35px 20px 35px 20px; margin:30px 0 0 0; background-image: linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -webkit-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -moz-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -o-linear-gradient(to bottom, #fdfdfd, #f6f6f6); background-image: -ms-linear-gradient(to bottom, #fdfdfd, #f6f6f6); border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; text-align:center; float:left; } .box-7::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 15px 30px 0 rgba(0,0,0,0.1); } .box-7 img { width:239px; padding:0; margin:0 auto; display:block; } #box-7 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:20px 0 0 0; color:#136394; cursor:default; } #box-7 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:23px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } #box-7 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:17px; line-height:17px; padding:0; margin:10px auto 0 auto; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:default; } .button-7 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:52px; width:calc(100% - 20px); height:50px; padding:0; margin:20px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-7:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-7:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-7:hover, .button-7:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-8 */ #box-8-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg5.jpg') no-repeat top center #f6f6f6; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-8 { width:1270px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-8 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } #box-8 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .video-8-w { width:1110px; padding:0; margin:60px auto 0 auto; position:relative; text-align:center; } .video-8 { width:350px; height:230px; overflow:hidden; padding:0; margin:10px; background:#f0eeef; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; float:left; } .video-8 img { min-width:100%; min-height:100%; padding:0; margin:0; display:block; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:8; } #box-8 .play-w { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 40px); left:calc(50% - 40px); z-index:30; } #box-8 .play { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-8 .play::before { content:''; width:28px; height:32px; padding:0; margin:0; position:absolute; top:calc(50% - 16px); left:calc(50% - 12px); z-index:11; background:url('../images/play.svg') no-repeat center center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; cursor:pointer; } #box-8 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-8 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-8 .pulse-1 { width:104px; height:104px; border:3px solid #136394; padding:0; margin:-52px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-8 .pulse-1::after { content:''; width:104px; height:104px; border:3px solid #5197c1; padding:0; margin:-58px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-8 .pulse-2 { width:136px; height:136px; border:2px solid #136394; padding:0; margin:-68px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-8 .pulse-2::after { content:''; width:136px; height:136px; border:2px solid #5197c1; padding:0; margin:-72px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } @media all and (max-width: 1280px) { #box-8 { width:1110px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-8 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } #box-8 h2 br { display:none; } } @media all and (max-width: 1200px) { #box-8-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg5.jpg') no-repeat top center #f6f6f6; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-8 { width:960px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-8 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #box-8 h2 br { display:none; } #box-8 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .video-8-w { width:960px; padding:0; margin:60px auto 0 auto; position:relative; text-align:center; } .video-8 { width:300px; height:230px; overflow:hidden; padding:0; margin:10px; background:#f0eeef; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; float:left; } .video-8 img { min-width:100%; min-height:100%; padding:0; margin:0; display:block; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:8; } #box-8 .play-w { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 40px); left:calc(50% - 40px); z-index:30; } #box-8 .play { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-8 .play::before { content:''; width:28px; height:32px; padding:0; margin:0; position:absolute; top:calc(50% - 16px); left:calc(50% - 12px); z-index:11; background:url('../images/play.svg') no-repeat center center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; cursor:pointer; } #box-8 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-8 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-8 .pulse-1 { width:104px; height:104px; border:3px solid #136394; padding:0; margin:-52px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-8 .pulse-1::after { content:''; width:104px; height:104px; border:3px solid #5197c1; padding:0; margin:-58px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-8 .pulse-2 { width:136px; height:136px; border:2px solid #136394; padding:0; margin:-68px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-8 .pulse-2::after { content:''; width:136px; height:136px; border:2px solid #5197c1; padding:0; margin:-72px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } @media all and (max-width: 1020px) { #box-8-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg5.jpg') no-repeat top center #f6f6f6; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #box-8 { width:660px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-8 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #box-8 h2 br { display:none; } #box-8 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .video-8-w { width:660px; padding:0; margin:60px auto 0 auto; position:relative; text-align:center; } .video-8 { width:300px; height:230px; overflow:hidden; padding:0; margin:15px; background:#f0eeef; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; float:left; } .video-8 img { min-width:100%; min-height:100%; padding:0; margin:0; display:block; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:8; } #box-8 .play-w { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 40px); left:calc(50% - 40px); z-index:30; } #box-8 .play { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-8 .play::before { content:''; width:28px; height:32px; padding:0; margin:0; position:absolute; top:calc(50% - 16px); left:calc(50% - 12px); z-index:11; background:url('../images/play.svg') no-repeat center center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; cursor:pointer; } #box-8 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-8 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-8 .pulse-1 { width:104px; height:104px; border:3px solid #136394; padding:0; margin:-52px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-8 .pulse-1::after { content:''; width:104px; height:104px; border:3px solid #5197c1; padding:0; margin:-58px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-8 .pulse-2 { width:136px; height:136px; border:2px solid #136394; padding:0; margin:-68px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-8 .pulse-2::after { content:''; width:136px; height:136px; border:2px solid #5197c1; padding:0; margin:-72px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } @media all and (max-width: 720px) { #box-8-w { width:100%; padding:0; margin:0; position:relative; background:#f6f6f6; } #box-8 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-8 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } #box-8 h2 br { display:none; } #box-8 h4 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:0; color:#ffffff; cursor:default; } .video-8-w { width:660px; padding:0; margin:30px auto 0 auto; position:relative; text-align:center; } .video-8 { width:360px; height:240px; overflow:hidden; padding:0; margin:20px 0 0 0; background:#f0eeef; position:relative; z-index:7; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; float:left; } .video-8 img { min-width:100%; min-height:100%; padding:0; margin:0; display:block; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; z-index:8; } #box-8 .play-w { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; border:none; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:calc(50% - 40px); left:calc(50% - 40px); z-index:30; } #box-8 .play { width:80px; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; background-image: linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -webkit-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -moz-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -o-linear-gradient(to bottom, #6ea5c6, #5197c1); background-image: -ms-linear-gradient(to bottom, #6ea5c6, #5197c1); border:none; border-bottom:3px solid #136394; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; position:absolute; top:0; left:0; z-index:30; -moz-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); -webkit-box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); box-shadow: 0 9px 16px 0 rgba(19,99,148,0.66); } #box-8 .play::before { content:''; width:28px; height:32px; padding:0; margin:0; position:absolute; top:calc(50% - 16px); left:calc(50% - 12px); z-index:11; background:url('../images/play.svg') no-repeat center center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; cursor:pointer; } #box-8 .play:hover { background-image: linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -webkit-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -moz-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -o-linear-gradient(to bottom, #5197c1, #6ea5c6); background-image: -ms-linear-gradient(to bottom, #5197c1, #6ea5c6); outline:none; } #box-8 .play:active { background-image: linear-gradient(to bottom, #5197c1, #5d90af); background-image: -webkit-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -moz-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -o-linear-gradient(to bottom, #5197c1, #5d90af); background-image: -ms-linear-gradient(to bottom, #5197c1, #5d90af); outline:none; } .play:hover, .play:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } #box-8 .pulse-1 { width:104px; height:104px; border:3px solid #136394; padding:0; margin:-52px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.41; } #box-8 .pulse-1::after { content:''; width:104px; height:104px; border:3px solid #5197c1; padding:0; margin:-58px 0 0 -55px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } #box-8 .pulse-2 { width:136px; height:136px; border:2px solid #136394; padding:0; margin:-68px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; opacity:0.27; } #box-8 .pulse-2::after { content:''; width:136px; height:136px; border:2px solid #5197c1; padding:0; margin:-72px 0 0 -70px; position:absolute; top:50%; left:50%; z-index:-1; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } } /* box-9 */ #box-9-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-9 { width:1110px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-9 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .box-9 { padding:0; position:relative; text-align:left; z-index:5; float:left; } .box-9-1 { width:330px; margin:40px 0 0 0; } .box-9-2 { width:370px; margin:40px 30px 0 30px; } .box-9-3 { width:350px; margin:40px 0 0 0; } .box-9-4 { width:330px; margin:40px 0 0 0; } .box-9-5 { width:370px; margin:40px 30px 0 30px; } .box-9-6 { width:350px; margin:40px 0 0 0; } .box-9 img { width:230px; padding:0; margin:0; display:block; position:relative; z-index:11; } #box-9 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-transform:uppercase; text-align:left; font-size:72px; line-height:72px; padding:0; margin:0; color:#136394; cursor:default; position:absolute; top:80px; left:0; z-index:10; } #box-9 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:0; color:#136394; cursor:default; } #box-9 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } @media all and (max-width: 1280px) { #box-9 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-9-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-9 { width:960px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-9 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-9 { padding:0; position:relative; text-align:left; z-index:5; float:left; } .box-9-1 { width:280px; margin:30px 0 0 0; } .box-9-2 { width:310px; margin:30px 35px 0 35px; } .box-9-3 { width:300px; margin:30px 0 0 0; } .box-9-4 { width:280px; margin:30px 0 0 0; } .box-9-5 { width:310px; margin:30px 35px 0 35px; } .box-9-6 { width:300px; margin:30px 0 0 0; } .box-9 img { width:230px; padding:0; margin:0; display:block; position:relative; z-index:11; } #box-9 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-transform:uppercase; text-align:left; font-size:72px; line-height:72px; padding:0; margin:0; color:#136394; cursor:default; position:absolute; top:80px; left:0; z-index:10; } #box-9 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:0; color:#136394; cursor:default; } #box-9 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } .clear660 { display:none; } @media all and (max-width: 1020px) { .clear660 { display:block; } #box-9-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-9 { width:660px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-9 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .box-9 { padding:0; position:relative; text-align:left; z-index:5; float:left; } .box-9-1 { width:330px; margin:30px 0 0 0; } .box-9-2 { width:330px; margin:30px 0 0 0; } .box-9-3 { width:330px; margin:30px 0 0 0; } .box-9-4 { width:330px; margin:30px 0 0 0; } .box-9-5 { width:330px; margin:30px 0 0 0; } .box-9-6 { width:330px; margin:30px 0 0 0; } .box-9 img { width:230px; padding:0; margin:0 auto; display:block; position:relative; z-index:11; } #box-9 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-transform:uppercase; text-align:left; font-size:72px; line-height:72px; padding:0; margin:0; color:#136394; cursor:default; position:absolute; top:80px; left:50px; z-index:10; } #box-9 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:0; color:#136394; cursor:default; } #box-9 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } @media all and (max-width: 720px) { #box-9-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-9 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-9 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } .box-9 { padding:0; position:relative; text-align:left; z-index:5; float:left; } .box-9-1 { width:360px; margin:30px 0 0 0; } .box-9-2 { width:360px; margin:20px 0 0 0; } .box-9-3 { width:360px; margin:-20px 0 0 0; } .box-9-4 { width:360px; margin:40px 0 0 0; } .box-9-5 { width:360px; margin:50px 0 0 0; } .box-9-6 { width:360px; margin:-10px 0 0 0; } .box-9 img { width:230px; padding:0; margin:0 auto; display:block; position:relative; z-index:11; } #box-9 h4 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-transform:uppercase; text-align:left; font-size:72px; line-height:72px; padding:0; margin:0; color:#136394; cursor:default; position:absolute; top:80px; left:70px; z-index:10; } #box-9 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:-10px 0 0 0; color:#136394; cursor:default; } #box-9 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; padding:0; margin:10px 0 0 0; color:#4d4d4d; cursor:default; } } /* box-10 */ #box-10-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg6.jpg') no-repeat top center #fdfdfd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img10-1 { width:459px; height:450px; padding:0; margin:0; background:url('../images/36.png') no-repeat top center; position:absolute; top:-100px; left:calc(50% - 905px); z-index:3; } .img10-2 { width:586px; height:397px; padding:0; margin:0; background:url('../images/37.png') no-repeat top center; position:absolute; right:calc(50% - 890px); bottom:-130px; z-index:3; mix-blend-mode:multiply; } #box-10 { width:1140px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-10 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } #box-10 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:48px; line-height:60px; padding:0; margin:80px 0 0 0; color:#136394; cursor:default; } #box-10 h3 span { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:48px; line-height:60px; padding:0 15px; margin:0; color:#ffffff; background:#3679a4; display:inline-block; cursor:default; } #box-10 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:30px; line-height:36px; max-width:660px; padding:0; margin:70px auto 0 auto; color:#3679a4; cursor:default; } .button-10 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:90px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-10::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-10:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-10:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-10:hover, .button-10:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { #box-10 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-10-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg6.jpg') no-repeat top center #fdfdfd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img10-1 { width:300px; height:450px; padding:0; margin:0; background:url('../images/36.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:30px; left:calc(50% - 635px); z-index:3; } .img10-2 { width:450px; height:340px; padding:0; margin:0; background:url('../images/37.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 690px); bottom:-130px; z-index:3; mix-blend-mode:multiply; } #box-10 { width:960px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-10 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #box-10 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:38px; line-height:50px; padding:0; margin:60px 0 0 0; color:#136394; cursor:default; } #box-10 h3 span { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:38px; line-height:50px; padding:0 15px; margin:0; color:#ffffff; background:#3679a4; display:inline-block; cursor:default; } #box-10 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:30px; max-width:530px; padding:0; margin:50px auto 0 auto; color:#3679a4; cursor:default; } .button-10 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:70px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-10::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-10:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-10:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-10:hover, .button-10:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-10-w { width:100%; padding:0; margin:0; position:relative; background:url('../images/bg6.jpg') no-repeat top center #fdfdfd; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .img10-1 { width:220px; height:450px; padding:0; margin:0; background:url('../images/36.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:270px; left:calc(50% - 450px); z-index:3; } .img10-2 { width:340px; height:240px; padding:0; margin:0; background:url('../images/37.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 490px); bottom:-100px; z-index:3; mix-blend-mode:multiply; } #box-10 { width:660px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-10 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #box-10 h2 br { display:none; } #box-10 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:34px; line-height:44px; padding:0; margin:60px 0 0 0; color:#136394; cursor:default; } #box-10 h3 span { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:34px; line-height:44px; padding:0 15px; margin:0; color:#ffffff; background:#3679a4; display:inline-block; cursor:default; } #box-10 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:26px; max-width:450px; padding:0; margin:50px auto 0 auto; color:#3679a4; cursor:default; } .button-10 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:60px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-10::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-10:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-10:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-10:hover, .button-10:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-10-w { width:100%; padding:0; margin:0; position:relative; background:#f6f6f6; } .img10-1 { width:200px; height:220px; padding:0; margin:0; background:url('../images/36.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:-50px; left:calc(50% - 100px); z-index:3; display:none; } .img10-2 { width:340px; height:240px; padding:0; margin:0; background:url('../images/37.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 170px); bottom:-100px; z-index:3; mix-blend-mode:multiply; } #box-10 { width:360px; padding:65px 0 170px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-10 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; } #box-10 h2 br { display:none; } #box-10 h3 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:19px; line-height:34px; padding:0; margin:50px 0 0 0; color:#136394; cursor:default; } #box-10 h3 span { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:19px; line-height:34px; padding:0 10px; margin:0; color:#ffffff; background:#3679a4; display:inline-block; cursor:default; } #box-10 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; max-width:450px; padding:0; margin:50px auto 0 auto; color:#3679a4; cursor:default; } .button-10 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:50px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .button-10::after { content:''; width:30px; height:30px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 15px); right:30px; z-index:auto; } .button-10:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-10:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-10:hover, .button-10:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-11 */ #box-11-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-11-w::after { content:''; width:100%; height:235px; padding:0; margin:0; background:#f7f7f7; position:absolute; left:0; bottom:0; z-index:2; } #box-11-w::before { content:''; width:719px; height:821px; padding:0; margin:0; background:url('../images/39.png') no-repeat top center; position:absolute; right:calc(50% - 960px); bottom:0; z-index:3; } #box-11::before { content:''; width:483px; height:571px; padding:0; margin:0; background:url('../images/38.png') no-repeat top center; position:absolute; left:-380px; top:-40px; z-index:-1; } #box-11 { width:1110px; padding:95px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-11 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } .box-11 { width:100%; max-width:840px; padding:0; margin:40px 0 0 0; position:relative; } .box-11 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:24px; line-height:30px; padding:25px 220px 20px 50px; margin:0; cursor:pointer; color:#136394; background:#f0f0f0; position:relative; z-index:11; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .box-11 h3 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:90px; line-height:90px; width:170px; padding:0; margin:0; cursor:pointer; color:#136394; position:absolute; top:-20px; right:0; z-index:auto; } .box-11 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:35px 50px 30px 50px; margin:-10px 0 0 0; cursor:default; color:#4d4d4d; background:#f6f7f7; position:relative; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; display:none; } .box-11-active p { display:block; } .box-11 p a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:24px; padding:0; margin:0; cursor:pointer; color:#136394; border-bottom:1px solid #136394; display:inline-block; } .box-11 p a:hover { border-bottom:1px solid rgba(0,0,0,0); } .box-11 p span { font-family: "Gilroy-B"; font-weight:normal; } .box-11 p::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); } #box-11 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:30px; line-height:36px; padding:0; margin:115px 0 0 0; color:#3679a4; cursor:default; float:left; } .button-11 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:400px; height:95px; padding:0 0 0 70px; margin:100px 0 0 30px; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; float:left; } .button-11::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-11:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-11:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-11:hover, .button-11:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1280px) { #box-11 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-11-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-11-w::after { content:''; width:100%; height:215px; padding:0; margin:0; background:#f7f7f7; position:absolute; left:0; bottom:0; z-index:2; } #box-11-w::before { content:''; width:560px; height:821px; padding:0; margin:0; background:url('../images/39.png') no-repeat bottom left; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 700px); bottom:0; z-index:3; } #box-11::before { content:''; width:360px; height:571px; padding:0; margin:0; background:url('../images/38.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:-280px; top:-40px; z-index:-1; } #box-11 { width:960px; padding:85px 0 60px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-11 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 50px 0; color:#136394; cursor:default; } .box-11 { width:100%; max-width:840px; padding:0; margin:40px 0 0 0; position:relative; } .box-11 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:22px; line-height:30px; padding:25px 220px 20px 50px; margin:0; cursor:pointer; color:#136394; background:#f0f0f0; position:relative; z-index:11; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .box-11 h3 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:80px; line-height:80px; width:170px; padding:0; margin:0; cursor:pointer; color:#136394; position:absolute; top:-20px; right:0; z-index:auto; } .box-11 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:24px; padding:35px 50px 30px 50px; margin:-10px 0 0 0; cursor:default; color:#4d4d4d; background:#f6f7f7; position:relative; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; display:none; } .box-11-active p { display:block; } .box-11 p a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:0; cursor:pointer; color:#136394; border-bottom:1px solid #136394; display:inline-block; } .box-11 p a:hover { border-bottom:1px solid rgba(0,0,0,0); } .box-11 p span { font-family: "Gilroy-B"; font-weight:normal; } .box-11 p::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); } #box-11 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0; margin:115px 0 0 0; color:#3679a4; cursor:default; float:left; } .button-11 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:360px; height:95px; padding:0 0 0 70px; margin:100px 0 0 50px; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; float:left; } .button-11::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-11:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-11:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-11:hover, .button-11:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #box-11-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-11-w::after { content:''; width:100%; height:215px; padding:0; margin:0; background:#f7f7f7; position:absolute; left:0; bottom:0; z-index:2; } #box-11-w::before { content:''; width:330px; height:400px; padding:0; margin:0; background:url('../images/39.png') no-repeat bottom left; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 500px); bottom:0; z-index:3; } #box-11::before { content:''; width:260px; height:471px; padding:0; margin:0; background:url('../images/38.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:-180px; top:-40px; z-index:-1; } #box-11 { width:660px; padding:85px 0 60px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-11 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 0 50px 0; color:#136394; cursor:default; } #box-11 h2 br { display:none; } .box-11 { width:100%; max-width:840px; padding:0; margin:40px 0 0 0; position:relative; } .box-11 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:22px; line-height:30px; padding:25px 220px 20px 50px; margin:0; cursor:pointer; color:#136394; background:#f0f0f0; position:relative; z-index:11; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .box-11 h3 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:80px; line-height:80px; width:170px; padding:0; margin:0; cursor:pointer; color:#136394; position:absolute; top:-20px; right:0; z-index:auto; } .box-11 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:24px; padding:35px 50px 30px 50px; margin:-10px 0 0 0; cursor:default; color:#4d4d4d; background:#f6f7f7; position:relative; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; display:none; } .box-11-active p { display:block; } .box-11 p a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:0; cursor:pointer; color:#136394; border-bottom:1px solid #136394; display:inline-block; } .box-11 p a:hover { border-bottom:1px solid rgba(0,0,0,0); } .box-11 p span { font-family: "Gilroy-B"; font-weight:normal; } .box-11 p::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); } #box-11 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:30px; padding:0; margin:70px 0 0 0; color:#3679a4; cursor:default; float:none; } .button-11 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:360px; height:95px; padding:0 0 0 70px; margin:100px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; float:none; } .button-11::after { content:''; width:34px; height:34px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 17px); right:50px; z-index:auto; } .button-11:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-11:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-11:hover, .button-11:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #box-11-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-11-w::after { content:''; width:100%; height:160px; padding:0; margin:0; background:#f7f7f7; position:absolute; left:0; bottom:0; z-index:2; } #box-11-w::before { content:''; width:200px; height:300px; padding:0; margin:0; background:url('../images/39.png') no-repeat bottom left; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; right:calc(50% - 300px); bottom:0; z-index:3; } #box-11::before { content:''; width:200px; height:471px; padding:0; margin:0; background:url('../images/38.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; left:-150px; top:200px; z-index:-1; display:none; } #box-11 { width:360px; padding:135px 0 40px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-11 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 0 50px 0; color:#136394; cursor:default; } #box-11 h2 br { display:none; } .box-11 { width:100%; max-width:840px; padding:0; margin:30px 0 0 0; position:relative; } .box-11 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:18px; line-height:24px; padding:25px 90px 20px 25px; margin:0; cursor:pointer; color:#136394; background:#f0f0f0; position:relative; z-index:11; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .box-11 h3 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:70px; line-height:70px; width:90px; padding:0; margin:0; cursor:pointer; color:#136394; position:absolute; top:-20px; right:0; z-index:auto; } .box-11 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:17px; line-height:23px; padding:25px 25px 25px 25px; margin:-10px 0 0 0; cursor:default; color:#4d4d4d; background:#f6f7f7; position:relative; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; display:none; } .box-11-active p { display:block; } .br360 { display:none; } .box-11 p a { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:17px; line-height:17px; padding:0; margin:0; cursor:pointer; color:#136394; border-bottom:1px solid #136394; display:inline-block; } .box-11 p a:hover { border-bottom:1px solid rgba(0,0,0,0); } .box-11 p span { font-family: "Gilroy-B"; font-weight:normal; } .box-11 p::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); box-shadow: 0 20px 30px 0 rgba(0,0,0,0.1); } #box-11 h4 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:26px; padding:0; margin:40px 0 0 0; color:#3679a4; cursor:default; float:none; } .button-11 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:80px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; float:none; } .button-11::after { content:''; width:30px; height:30px; padding:0; margin:0; cursor:pointer; background:url('../images/6.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 15px); right:30px; z-index:auto; } .button-11:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .button-11:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .button-11:hover, .button-11:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* box-12 */ #box-12-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-12 { width:1110px; padding:95px 0 100px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-12 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } .p12-1, .p12-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0 0 0 40px; margin:70px 50px 0 0; color:#4d4d4d; cursor:default; float:left; position:relative; } .p12-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } .p12-2 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:24px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:pointer; position:relative; } .p12-2 a:hover { border-bottom:1px solid rgba(0,0,0,0); } .p12-2 a::after { content:''; width:19px; height:19px; padding:0; margin:0; cursor:pointer; background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-40px; z-index:auto; } .ico12-1::after { content:''; width:21px; height:21px; padding:0; margin:0; background:url('../images/cursor.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-40px; z-index:auto; } .ico12-2::after { content:''; width:18px; height:18px; padding:0; margin:0; background:url('../images/bus.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-38px; z-index:auto; } .ico12-3::after { content:''; width:20px; height:20px; padding:0; margin:0; background:url('../images/login.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-42px; z-index:auto; } #map-box { width:840px; height:380px; padding:0; margin:50px 0 0 0; position:relative; } #map-box img { width:270px; padding:0; margin:0; display:block; position:absolute; top:-20px; right:-170px; z-index:8; } #map-box::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } #map-w { width:100%; height:100%; overflow:hidden; padding:0; margin:0; position:relative; z-index:10; background:#fbfbfb; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #map { width:100%; height:100%; padding:0; margin:0; position:relative; text-align:center; } @media all and (max-width: 1280px) { #box-12 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:46px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } } @media all and (max-width: 1200px) { #box-12-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-12 { width:960px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-12 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } .p12-1, .p12-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 30px; margin:70px 50px 0 0; color:#4d4d4d; cursor:default; float:left; position:relative; } .p12-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } .p12-2 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:pointer; position:relative; } .p12-2 a:hover { border-bottom:1px solid rgba(0,0,0,0); } .p12-2 a::after { content:''; width:19px; height:19px; padding:0; margin:0; cursor:pointer; background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-30px; z-index:auto; } .ico12-1::after { content:''; width:21px; height:21px; padding:0; margin:0; background:url('../images/cursor.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-30px; z-index:auto; } .ico12-2::after { content:''; width:18px; height:18px; padding:0; margin:0; background:url('../images/bus.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-28px; z-index:auto; } .ico12-3::after { content:''; width:20px; height:20px; padding:0; margin:0; background:url('../images/login.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-32px; z-index:auto; } #map-box { width:780px; height:380px; padding:0; margin:50px 0 0 0; position:relative; } #map-box img { width:270px; padding:0; margin:0; display:block; position:absolute; top:-20px; right:-170px; z-index:8; } #map-box::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } #map-w { width:100%; height:100%; overflow:hidden; padding:0; margin:0; position:relative; z-index:10; background:#fbfbfb; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #map { width:100%; height:100%; padding:0; margin:0; position:relative; text-align:center; } } @media all and (max-width: 1020px) { #box-12-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-12 { width:660px; padding:85px 0 90px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-12 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0 auto; max-width:480px; color:#136394; cursor:default; } #box-12 h2 br { display:none; } .p12-1, .p12-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 30px; color:#4d4d4d; cursor:default; position:relative; } .p12-1 { margin:70px 50px 0 0; float:left; } .p12-2 { margin:70px 0 0 0; float:right; } .p12-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } .p12-2 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:pointer; position:relative; } .p12-2 a:hover { border-bottom:1px solid rgba(0,0,0,0); } .p12-2 a::after { content:''; width:19px; height:19px; padding:0; margin:0; cursor:pointer; background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-30px; z-index:auto; } .ico12-1::after { content:''; width:21px; height:21px; padding:0; margin:0; background:url('../images/cursor.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-30px; z-index:auto; } .ico12-2::after { content:''; width:18px; height:18px; padding:0; margin:0; background:url('../images/bus.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-28px; z-index:auto; } .ico12-3::after { content:''; width:20px; height:20px; padding:0; margin:0; background:url('../images/login.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-32px; z-index:auto; } #map-box { width:490px; height:380px; padding:0; margin:50px 0 0 0; position:relative; } #map-box img { width:270px; padding:0; margin:0; display:block; position:absolute; top:-20px; right:-170px; z-index:8; } #map-box::after { content:''; width:calc(100% - 120px); height:100%; padding:0; margin:0; position:absolute; left:60px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } #map-w { width:100%; height:100%; overflow:hidden; padding:0; margin:0; position:relative; z-index:10; background:#fbfbfb; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #map { width:100%; height:100%; padding:0; margin:0; position:relative; text-align:center; } } @media all and (max-width: 720px) { #box-12-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #box-12 { width:360px; padding:65px 0 70px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #box-12 h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 auto; max-width:480px; color:#136394; cursor:default; } #box-12 h2 br { display:none; } .p12-1, .p12-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:28px; padding:0 0 0 30px; color:#4d4d4d; cursor:default; position:relative; } .p12-1 { margin:50px 0 0 0; float:none; } .p12-2 { margin:30px 0 0 0; float:none; } .p12-1 span { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } .p12-2 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:18px; padding:0; margin:0; color:#136394; border-bottom:1px solid #136394; display:inline-block; cursor:pointer; position:relative; } .p12-2 a:hover { border-bottom:1px solid rgba(0,0,0,0); } .p12-2 a::after { content:''; width:17px; height:17px; padding:0; margin:0; cursor:pointer; background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:-30px; z-index:auto; } .ico12-1::after { content:''; width:21px; height:21px; padding:0; margin:0; background:url('../images/cursor.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-30px; z-index:auto; } .ico12-2::after { content:''; width:18px; height:18px; padding:0; margin:0; background:url('../images/bus.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-28px; z-index:auto; } .ico12-3::after { content:''; width:20px; height:20px; padding:0; margin:0; background:url('../images/login.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:0; left:-32px; z-index:auto; } #map-box { width:300px; height:300px; padding:0; margin:50px 0 0 0; position:relative; } #map-box img { width:220px; padding:0; margin:0; display:block; position:absolute; top:-20px; right:-120px; z-index:8; } #map-box::after { content:''; width:calc(100% - 60px); height:100%; padding:0; margin:0; position:absolute; left:30px; bottom:-8px; z-index:-1; background:#e7e7e7; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -khtml-border-radius:15px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } #map-w { width:100%; height:100%; overflow:hidden; padding:0; margin:0; position:relative; z-index:10; background:#fbfbfb; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } #map { width:100%; height:100%; padding:0; margin:0; position:relative; text-align:center; } } /* bottom */ #bottom-w { width:100%; padding:0; margin:0; position:relative; background:#f9f8f8; } #bottom { width:1110px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #bottom a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #bottom h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } .bp-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } .bp-1 a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:30px; line-height:24px; padding:0 0 0 35px; margin:0; color:#333333; cursor:pointer; display:inline-block; position:relative; } .bp-1 a::after { content:''; width:22px; height:22px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; position:absolute; top:1px; left:0; z-index:auto; } .bp-1 a:hover { color:#136394; } .bp-1 a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; } .bp-1 a:hover::after, .bp-1 a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } .bp-1 span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:18px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } .bp-1 span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } .bp-1 span:hover, .bp-1 span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .bp-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:left; position:relative; } .bp-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:right; position:relative; } .bp-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-3 a:hover { color:#136394; } .bp-4 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; position:relative; } .bp-4 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-4 a:hover { color:#136394; } .bp-4 a:hover, .bp-4 a:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { #bottom-w { width:100%; padding:0; margin:0; position:relative; background:#f9f8f8; } #bottom { width:960px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #bottom a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #bottom h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } .bp-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } .bp-1 a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; position:relative; } .bp-1 a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } .bp-1 a:hover { color:#136394; } .bp-1 a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } .bp-1 a:hover::after, .bp-1 a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } .bp-1 span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } .bp-1 span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } .bp-1 span:hover, .bp-1 span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .bp-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:left; position:relative; } .bp-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:right; position:relative; } .bp-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-3 a:hover { color:#136394; } .bp-4 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; position:relative; } .bp-4 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-4 a:hover { color:#136394; } .bp-4 a:hover, .bp-4 a:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #bottom-w { width:100%; padding:0; margin:0; position:relative; background:#f9f8f8; } #bottom { width:660px; padding:20px 0 20px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #bottom a.logo { width:58px; height:84px; padding:0; margin:0; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #bottom h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } .bp-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:right; font-size:18px; line-height:24px; padding:0; margin:20px 0 0 0; color:#333333; cursor:default; float:right; position:relative; } .bp-1 a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; position:relative; } .bp-1 a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } .bp-1 a:hover { color:#136394; } .bp-1 a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } .bp-1 a:hover::after, .bp-1 a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } .bp-1 span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:right; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } .bp-1 span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } .bp-1 span:hover, .bp-1 span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .bp-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:left; position:relative; } .bp-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:20px 0 0 0; color:#c3c3c3; cursor:default; float:right; position:relative; } .bp-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:right; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-3 a:hover { color:#136394; } .bp-4 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; position:relative; } .bp-4 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-4 a:hover { color:#136394; } .bp-4 a:hover, .bp-4 a:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #bottom-w { width:100%; padding:0; margin:0; position:relative; background:#f9f8f8; } #bottom { width:360px; padding:40px 0 40px 0; margin:0 auto; position:relative; text-align:center; z-index:5; } #bottom a.logo { width:58px; height:84px; padding:0; margin:0 0 0 50px; display:block; cursor:pointer; background:url('../images/logo.png') no-repeat; float:left; } #bottom h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:16px; line-height:22px; padding:0; margin:25px 0 0 20px; color:#136394; cursor:default; float:left; } .bp-1 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; width:360px; padding:0; margin:20px auto 0 auto; color:#333333; cursor:default; float:none; display:inline-block; position:relative; } .bp-1 a { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:center; font-size:22px; line-height:22px; padding:0 0 0 30px; margin:0; color:#333333; cursor:pointer; display:inline-block; position:relative; } .bp-1 a::after { content:''; width:18px; height:18px; padding:0; margin:0; cursor:pointer; background:url('../images/phone.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:1px; left:0; z-index:auto; } .bp-1 a:hover { color:#136394; } .bp-1 a:hover::after { background:url('../images/phone2.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; } .bp-1 a:hover::after, .bp-1 a:not(:hover)::after { -webkit-transition: All 0s ease; -moz-transition: All 0s ease; -o-transition: All 0s ease; -ms-transition: All 0s ease; transition: All 0s ease; } .bp-1 span { font-family: "Montserrat-SB"; font-weight:normal; font-style:normal; text-align:center; font-size:16px; line-height:16px; padding:0; margin:0; color:#333333; cursor:pointer; border-bottom:1px solid #333333; display:inline-block; } .bp-1 span:hover { color:#136394; border-bottom:1px solid rgba(0,0,0,0); } .bp-1 span:hover, .bp-1 span:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .bp-2 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; float:none; position:relative; } .bp-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; float:none; position:relative; } .bp-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-3 a:hover { color:#136394; } .bp-4 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:20px auto 0 auto; color:#c3c3c3; cursor:default; position:relative; } .bp-4 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:center; font-size:12px; line-height:16px; padding:0; margin:0; color:#c3c3c3; cursor:pointer; display:inline-block; } .bp-4 a:hover { color:#136394; } .bp-4 a:hover, .bp-4 a:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* noone */ .noone { width:0; height:0; overflow:hidden; position:absolute; top:0; left:0; z-index:0; } /* wrapper */ .wrapper-1 { display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0.75); z-index:100; } .wrapper-2 { position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0.75); z-index:100; } /* close */ .close { width:24px; height:24px; overflow:hidden; float:right; padding:0; margin:0; cursor:pointer; border:2px solid #dde1eb; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; outline:none; position:absolute; top:15px; right:15px; z-index:207; } .close::after { content:''; position:absolute; width:16px; height:2px; background:#dde1eb; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top:11px; left:4px; z-index:208; } .close::before { content:''; position:absolute; width:16px; height:2px; background:#dde1eb; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top:11px; left:4px; z-index:208; } .close:hover { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .close:hover, .close:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } /* thnx */ .thnx { display:none; width:800px; padding:80px 40px 70px 40px; margin:0; text-align:center; position:fixed; left:calc(50% - 440px); top:calc(50% - 290px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .thnx::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .ico-thnx { width:128px; height:128px; padding:0; margin:0 auto; background:url('../images/correct.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; display:block; } .thnx h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:40px auto 0 auto; color:#136394; cursor:default; position:relative; } .close-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:30px; line-height:30px; padding:0; margin:100px auto 0 auto; color:#e2e2e2; border-bottom:1px solid #e2e2e2; cursor:pointer; display:inline-block; } .close-2:hover { border-bottom:1px solid rgba(0,0,0,0); } .close-2:hover, .close-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { } @media all and (max-width: 1020px) { .thnx { display:none; width:580px; padding:50px 40px 30px 40px; margin:0; position:fixed; left:calc(50% - 330px); top:calc(50% - 250px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .thnx::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .ico-thnx { width:128px; height:128px; padding:0; margin:0 auto; background:url('../images/correct.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; display:block; } .thnx h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:26px; line-height:32px; padding:0; margin:40px auto 0 auto; color:#136394; cursor:default; position:relative; } .close-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:26px; line-height:26px; padding:0; margin:100px auto 0 auto; color:#e2e2e2; border-bottom:1px solid #e2e2e2; cursor:pointer; display:inline-block; } .close-2:hover { border-bottom:1px solid rgba(0,0,0,0); } .close-2:hover, .close-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { .thnx { display:none; width:100%; height:calc(100% - 100px); padding:70px 0 30px 0; margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .thnx::after { display:none; content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .ico-thnx { width:128px; height:128px; padding:0; margin:0 auto; background:url('../images/correct.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; display:block; } .thnx h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; width:360px; padding:0; margin:40px auto 0 auto; color:#136394; cursor:default; position:relative; } .close-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:20px; padding:0; margin:90px auto 0 auto; color:#e2e2e2; border-bottom:1px solid #e2e2e2; cursor:pointer; display:inline-block; } .close-2:hover { border-bottom:1px solid rgba(0,0,0,0); } .close-2:hover, .close-2:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* z */ .z-box { display:none; width:800px; padding:50px 40px 30px 40px; margin:0; position:fixed; left:calc(50% - 440px); top:calc(50% - 290px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .z-box::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .z-box::before { content:''; width:295px; height:499px; padding:0; margin:0; position:absolute; top:50px; right:-40px; z-index:auto; background:url('../images/44.png') no-repeat top center; } .z-box h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 0 30px 0; color:#136394; cursor:default; position:relative; } .z-box p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0 0 0 45px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .z-box p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox { width:100%; max-width:470px; margin:40px 0 0 0; padding:0; text-align:center; position:relative; } .formbox input { font-family: "Montserrat-B"; font-weight:normal; font-size:24px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:35px 30px 30px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox input:-moz-placeholder {color:#37759e; } .formbox input::-webkit-input-placeholder { color:#37759e; } .formbox input.error:-moz-placeholder { color:#db264c; } .formbox input.error::-webkit-input-placeholder { color:#db264c; } .formbox input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0 0 0 25px; margin:20px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a:hover { color:#37759e; } .checkbox input[type=checkbox] { display:none; } .checkbox label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox input[type=checkbox]:checked + label::before { display:block; } .formbox .submit { width:100%; height:95px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:24px; line-height:97px; width:100%; height:95px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox .submit input:hover, .formbox .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { } .z-box::-webkit-scrollbar {width:0; height:0;} .z-box::-webkit-scrollbar-button {width:0; height:0; background:#ffffff; } .z-box::-webkit-scrollbar-track {background:#ffffff;} .z-box::-webkit-scrollbar-track-piece {background:#ffffff;} .z-box::-webkit-scrollbar-thumb {height:5px; background:#136394;} .z-box::-webkit-scrollbar-corner {background:#ffffff;} .z-box::-webkit-resizer {background:#ffffff;} @media all and (max-width: 1020px) { .z-box { display:none; width:100%; height:calc(100% - 80px); overflow-x:hidden; overflow-y:auto; padding:50px 0 30px 0; margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .z-box::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); display:none; } .z-box::before { content:''; width:200px; height:360px; padding:0; margin:0; position:absolute; top:190px; right:-30px; z-index:auto; background:url('../images/44.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; display:none; } .z-box h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; width:660px; padding:0; margin:0 auto 30px auto; color:#136394; cursor:default; position:relative; } .z-box p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 35px; max-width:470px; margin:5px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .z-box p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox { width:100%; max-width:420px; margin:40px auto 0 auto; padding:0; text-align:center; position:relative; } .formbox input { font-family: "Montserrat-B"; font-weight:normal; font-size:20px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:35px 30px 30px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox input:-moz-placeholder {color:#37759e; } .formbox input::-webkit-input-placeholder { color:#37759e; } .formbox input.error:-moz-placeholder { color:#db264c; } .formbox input.error::-webkit-input-placeholder { color:#db264c; } .formbox input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0 0 0 25px; margin:20px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a:hover { color:#37759e; } .checkbox input[type=checkbox] { display:none; } .checkbox label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox input[type=checkbox]:checked + label::before { display:block; } .formbox .submit { width:100%; height:95px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:20px; line-height:97px; width:100%; height:95px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox .submit input:hover, .formbox .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { .z-box { display:none; width:100%; overflow-x:hidden; overflow-y:auto; height:calc(100% - 80px); padding:50px 0 30px 0; margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .z-box::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); display:none; } .z-box::before { content:''; width:160px; height:280px; padding:0; margin:0; position:absolute; top:230px; right:calc(50% - 220px); z-index:auto; background:url('../images/44.png') no-repeat top center; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; display:none; } .z-box h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; width:360px; padding:0; margin:0 auto 20px auto; color:#136394; cursor:default; position:relative; } .z-box p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; width:325px; padding:0 0 0 35px; margin:5px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .z-box p::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox { width:100%; max-width:360px; margin:30px auto 0 auto; padding:0; text-align:center; position:relative; } .formbox input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 40px); height:30px; padding:25px 20px 20px 20px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox input:-moz-placeholder {color:#37759e; } .formbox input::-webkit-input-placeholder { color:#37759e; } .formbox input.error:-moz-placeholder { color:#db264c; } .formbox input.error::-webkit-input-placeholder { color:#db264c; } .formbox input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0 0 0 25px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox a:hover { color:#37759e; } .checkbox input[type=checkbox] { display:none; } .checkbox label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox input[type=checkbox]:checked + label::before { display:block; } .formbox .submit { width:100%; height:80px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:82px; width:100%; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox .submit input:hover, .formbox .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* z */ .quiz { display:none; width:800px; padding:50px 40px 50px 40px; margin:0; position:fixed; left:calc(50% - 440px); top:calc(50% - 290px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .quiz-step-1 { background:url('../images/41.png') no-repeat bottom left #ffffff; } .quiz-step-2 { background:url('../images/42.png') no-repeat bottom right #ffffff; } .quiz-step-3 { background:url('../images/43.png') no-repeat bottom left #ffffff; } .quiz-step-4 { background:#ffffff; } .quiz::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .loading { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; letter-spacing:2px; font-size:12px; line-height:52px; width:100%; max-width:550px; height:50px; padding:0; margin:0 auto; color:#4d4d4d; cursor:default; background:#f3f5f6; position:relative; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; -khtml-border-radius:50px; } .step-1 { color:#4d4d4d; position:relative; z-index:10; } .step-2 { color:#ffffff; position:relative; z-index:10; } .step-3 { color:#ffffff; position:relative; z-index:10; } .loading-1 { width:30%; height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:50px; -webkit-border-top-left-radius:50px; -moz-border-top-left-radius:50px; -khtml-border-top-left-radius:50px; border-bottom-right-radius:0; -webkit-border-bottom-right-radius:0; -moz-border-bottom-right-radius:0; -khtml-border-bottom-right-radius:0; border-bottom-left-radius:50px; -webkit-border-bottom-left-radius:50px; -moz-border-bottom-left-radius:50px; -khtml-border-bottom-left-radius:50px; } .loading-2 { width:60%; height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:50px; -webkit-border-top-left-radius:50px; -moz-border-top-left-radius:50px; -khtml-border-top-left-radius:50px; border-bottom-right-radius:0; -webkit-border-bottom-right-radius:0; -moz-border-bottom-right-radius:0; -khtml-border-bottom-right-radius:0; border-bottom-left-radius:50px; -webkit-border-bottom-left-radius:50px; -moz-border-bottom-left-radius:50px; -khtml-border-bottom-left-radius:50px; } .loading-3 { width:calc(100% - 10px); height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; -khtml-border-radius:50px; } .quiz h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:50px 0 30px 0; color:#136394; cursor:default; position:relative; } .radiobox { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; max-width:310px; padding:0; margin:20px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } body:not(#Foo) input[type=radio] { display:none; } body:not(#Foo) input[type=radio] + label { width:250px; padding:0 0 0 60px; position:relative; cursor:pointer; } body:not(#Foo) input[type=radio] + label::after { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } body:not(#Foo) input[type=radio]:checked + label::after { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .checkbox-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; max-width:310px; padding:0; margin:20px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .checkbox-2 input[type=checkbox] { display:none; } .checkbox-2 label { width:250px; padding:0 0 0 60px; position:relative; cursor:pointer; } .checkbox-2 label::before { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .checkbox-2 input[type=checkbox]:checked + label::before { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .step-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:62px; width:310px; height:60px; padding:0; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .step-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .step-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .step-button:hover, .step-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .formbox-2 { width:100%; max-width:470px; margin:40px auto 0 auto; padding:0 0 30px 0; text-align:center; position:relative; } .formbox-2 input { font-family: "Montserrat-B"; font-weight:normal; font-size:24px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:35px 30px 30px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-2 input:-moz-placeholder {color:#37759e; } .formbox-2 input::-webkit-input-placeholder { color:#37759e; } .formbox-2 input.error:-moz-placeholder { color:#db264c; } .formbox-2 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-2 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-1 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0 0 0 25px; margin:20px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a:hover { color:#37759e; } .checkbox-1 input[type=checkbox] { display:none; } .checkbox-1 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:14px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-1 label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-1 input[type=checkbox]:checked + label::before { display:block; } .formbox-2 .submit { width:100%; height:95px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-2 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:24px; line-height:97px; width:100%; height:95px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-2 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-2 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-2 .submit input:hover, .formbox-2 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { } .quiz::-webkit-scrollbar {width:0; height:0;} .quiz::-webkit-scrollbar-button {width:0; height:0; background:#ffffff; } .quiz::-webkit-scrollbar-track {background:#ffffff;} .quiz::-webkit-scrollbar-track-piece {background:#ffffff;} .quiz::-webkit-scrollbar-thumb {height:5px; background:#136394;} .quiz::-webkit-scrollbar-corner {background:#ffffff;} .quiz::-webkit-resizer {background:#ffffff;} @media all and (max-width: 1020px) { .quiz { display:none; width:580px; overflow-x:hidden; overflow-y:auto; height:calc(100% - 80px); padding:50px calc(50% - 290px) 30px calc(50% - 290px); margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .quiz::after { content:''; display:none; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .quiz h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:40px 0 30px 0; color:#136394; cursor:default; position:relative; } .radiobox { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; max-width:310px; padding:0; margin:20px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } body:not(#Foo) input[type=radio] { display:none; } body:not(#Foo) input[type=radio] + label { width:250px; padding:0 0 0 60px; position:relative; cursor:pointer; } body:not(#Foo) input[type=radio] + label::after { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } body:not(#Foo) input[type=radio]:checked + label::after { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .checkbox-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; max-width:310px; padding:0; margin:20px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .checkbox-2 input[type=checkbox] { display:none; } .checkbox-2 label { width:250px; padding:0 0 0 60px; position:relative; cursor:pointer; } .checkbox-2 label::before { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .checkbox-2 input[type=checkbox]:checked + label::before { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .step-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:62px; width:310px; height:60px; padding:0; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .step-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .step-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .step-button:hover, .step-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .formbox-2 { width:100%; max-width:420px; margin:40px auto 0 auto; padding:0 0 30px 0; text-align:center; position:relative; } .formbox-2 input { font-family: "Montserrat-B"; font-weight:normal; font-size:20px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:35px 30px 30px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-2 input:-moz-placeholder {color:#37759e; } .formbox-2 input::-webkit-input-placeholder { color:#37759e; } .formbox-2 input.error:-moz-placeholder { color:#db264c; } .formbox-2 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-2 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-1 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0 0 0 25px; margin:20px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a:hover { color:#37759e; } .checkbox-1 input[type=checkbox] { display:none; } .checkbox-1 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:13px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-1 label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-1 input[type=checkbox]:checked + label::before { display:block; } .formbox-2 .submit { width:100%; height:95px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-2 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:20px; line-height:97px; width:100%; height:95px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-2 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-2 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-2 .submit input:hover, .formbox-2 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { .quiz { display:none; width:100%; overflow-x:hidden; overflow-y:auto; height:calc(100% - 80px); padding:50px 0 30px 0; margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .quiz::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); display:none; } .loading { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; letter-spacing:2px; font-size:12px; line-height:52px; width:100%; max-width:360px; height:50px; padding:0; margin:0 auto; color:#4d4d4d; cursor:default; background:#f3f5f6; position:relative; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; -khtml-border-radius:50px; } .loading-1 { width:30%; height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:50px; -webkit-border-top-left-radius:50px; -moz-border-top-left-radius:50px; -khtml-border-top-left-radius:50px; border-bottom-right-radius:0; -webkit-border-bottom-right-radius:0; -moz-border-bottom-right-radius:0; -khtml-border-bottom-right-radius:0; border-bottom-left-radius:50px; -webkit-border-bottom-left-radius:50px; -moz-border-bottom-left-radius:50px; -khtml-border-bottom-left-radius:50px; } .loading-2 { width:66%; height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:50px; -webkit-border-top-left-radius:50px; -moz-border-top-left-radius:50px; -khtml-border-top-left-radius:50px; border-bottom-right-radius:0; -webkit-border-bottom-right-radius:0; -moz-border-bottom-right-radius:0; -khtml-border-bottom-right-radius:0; border-bottom-left-radius:50px; -webkit-border-bottom-left-radius:50px; -moz-border-bottom-left-radius:50px; -khtml-border-bottom-left-radius:50px; } .loading-3 { width:calc(100% - 10px); height:40px; padding:0; margin:0; cursor:default; background:url('../images/loading.png') repeat-x center left #2f85ba; position:absolute; top:5px; left:5px; z-index:9; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; -khtml-border-radius:50px; } .quiz h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; width:360px; padding:0; margin:40px auto 25px auto; color:#136394; cursor:default; position:relative; } .quiz h2 br { display:none; } .radiobox { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:30px; max-width:270px; padding:0; margin:15px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } body:not(#Foo) input[type=radio] { display:none; } body:not(#Foo) input[type=radio] + label { width:220px; padding:0 0 0 50px; position:relative; cursor:pointer; } body:not(#Foo) input[type=radio] + label::after { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } body:not(#Foo) input[type=radio]:checked + label::after { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .checkbox-2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:30px; max-width:270px; padding:0; margin:15px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .checkbox-2 input[type=checkbox] { display:none; } .checkbox-2 label { width:220px; padding:0 0 0 50px; position:relative; cursor:pointer; } .checkbox-2 label::before { content:''; width:34px; height:34px; padding:0; margin:0; background:#f3f5f6; position:absolute; top:calc(50% - 17px); left:0; cursor:pointer; z-index:auto; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .checkbox-2 input[type=checkbox]:checked + label::before { background:url('../images/5.svg') no-repeat center 13px #2c80b4; -webkit-background-size: 16px auto; -moz-background-size: 16px auto; -o-background-size: 16px auto; background-size: 16px auto; } .step-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:52px; width:300px; height:50px; padding:0; margin:30px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; } .step-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .step-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .step-button:hover, .step-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .formbox-2 { width:100%; max-width:360px; margin:30px auto 0 auto; padding:0; text-align:center; position:relative; } .formbox-2 input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 40px); height:30px; padding:25px 20px 20px 20px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-2 input:-moz-placeholder {color:#37759e; } .formbox-2 input::-webkit-input-placeholder { color:#37759e; } .formbox-2 input.error:-moz-placeholder { color:#db264c; } .formbox-2 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-2 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-1 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0 0 0 25px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 a:hover { color:#37759e; } .checkbox-1 input[type=checkbox] { display:none; } .checkbox-1 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-1 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-25px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-1 label::before { content: ""; position: absolute; z-index:12; top:7px; left:-17px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-1 input[type=checkbox]:checked + label::before { display:block; } .formbox-2 .submit { width:100%; height:80px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-2 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:82px; width:100%; height:80px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-2 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-2 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-2 .submit input:hover, .formbox-2 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* z */ .z-box-2 { display:none; width:800px; padding:50px 40px 30px 40px; margin:0; position:fixed; left:calc(50% - 440px); top:calc(50% - 180px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .z-box-2::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .z-box-2 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 0 25px 0; color:#136394; cursor:default; position:relative; } .z-box-2 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } @media all and (max-width: 1200px) { } @media all and (max-width: 1020px) { .z-box-2 { display:none; width:580px; padding:50px 40px 30px 40px; margin:0; position:fixed; left:calc(50% - 330px); top:calc(50% - 220px); z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .z-box-2::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .z-box-2 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0 0 25px 0; color:#136394; cursor:default; position:relative; } .z-box-2 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:0; color:#4d4d4d; cursor:default; position:relative; } } @media all and (max-width: 720px) { .z-box-2 { display:none; width:100%; height:calc(100% - 80px); padding:50px 0 30px 0; margin:0; position:fixed; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .z-box-2::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); display:none; } .z-box-2 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; width:360px; padding:0; margin:0 auto 20px auto; color:#136394; cursor:default; position:relative; } .z-box-2 p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; width:360px; padding:0; margin:0 auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } } /* z3 */ .z-box-3-w { display:none; width:100%; height:100%; overflow-x:hidden; overflow-y:auto; padding:0; margin:0; position:fixed; left:0; top:0; z-index:102; background:rgba(255,255,255,0.1); } .z-box-3-w::-webkit-scrollbar {width:0; height:0;} .z-box-3-w::-webkit-scrollbar-button {width:0; height:0; background:#ffffff; } .z-box-3-w::-webkit-scrollbar-track {background:#ffffff;} .z-box-3-w::-webkit-scrollbar-track-piece {background:#ffffff;} .z-box-3-w::-webkit-scrollbar-thumb {height:5px; background:#136394;} .z-box-3-w::-webkit-scrollbar-corner {background:#ffffff;} .z-box-3-w::-webkit-resizer {background:#ffffff;} .z-box-3 { width:990px; padding:50px 60px 30px 60px; margin:0; position:absolute; left:calc(50% - 555px); top:10px; z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .z-box-3::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .left-zb3 { width:580px; padding:0; margin:0; position:relative; float:left; z-index:10; } .z-box-3 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:30px; line-height:36px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } .zb3-p1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:22px; line-height:30px; padding:0; margin:15px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p1 span { font-family: "Gilroy-B"; font-weight:normal; } .z-box-3 a.pdf { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:22px; line-height:22px; padding:0; margin:20px 0 0 45px; color:#317fb0; border-bottom:1px solid #317fb0; cursor:pointer; position:relative; display:inline-block; } .z-box-3 a.pdf:hover { border-bottom:1px solid rgba(0,0,0,0); } .z-box-3 a.pdf::after { content:''; width:26px; height:28px; padding:0; margin:0; cursor:pointer; background:url('../images/download.svg') no-repeat 0 0; position:absolute; top:-3px; left:-45px; z-index:auto; } .right-zb3 { width:360px; padding:0; margin:0; position:relative; float:right; z-index:10; } .big-img { width:100%; height:500px; overflow:hidden; padding:0; margin:0; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; z-index:10; cursor:pointer; } .small-img { width:50px; height:70px; overflow:hidden; padding:0; margin:10px 5px 0 5px; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; float:left; z-index:10; cursor:pointer; } .big-img img, .small-img img { width:100%; padding:0; margin:0; display:block; cursor:pointer; } .big-img::after, .small-img::after { content:''; width:100%; height:100%; padding:0; margin:0; background:#f0f0f0; position:absolute; top:0; left:0; z-index:auto; cursor:pointer; opacity:0; } .big-img:hover::after, .small-img:hover::after { opacity:0.25; } .big-img:hover::after, .big-img:not(:hover)::after, .small-img:hover::after, .small-img:not(:hover)::after { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3::before { content:''; width:100%; height:360px; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:2; background:#f6f6f6; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; } .bottom-zb3 { width:580px; padding:0; margin:100px 0 0 0; position:relative; float:left; z-index:10; } .z-box-3 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; position:relative; } .zb3-p2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:22px; line-height:30px; padding:0 0 0 35px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p2::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox-3 { width:360px; margin:100px 0 0 0; padding:0; text-align:center; position:relative; float:right; z-index:10; } .formbox-3 input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:22px 30px 18px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-3 input:-moz-placeholder {color:#37759e; } .formbox-3 input::-webkit-input-placeholder { color:#37759e; } .formbox-3 input.error:-moz-placeholder { color:#db264c; } .formbox-3 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-3 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0 0 0 20px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a:hover { color:#37759e; } .checkbox-3 input[type=checkbox] { display:none; } .checkbox-3 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:12px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-20px; top:0; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-3 label::before { content: ""; position: absolute; z-index:12; top:7px; left:-12px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-3 input[type=checkbox]:checked + label::before { display:block; } .formbox-3 .submit { width:100%; height:70px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-3 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:72px; width:100%; height:70px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-3 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-3 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-3 .submit input:hover, .formbox-3 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3 h6 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:38px; padding:0; margin:10px 0 0 0; color:#1c597f; cursor:default; position:relative; } .z-box-3 h6 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:36px; line-height:38px; padding:0; margin:0; color:#1c597f; cursor:pointer; position:relative; } @media all and (max-width: 1200px) { .z-box-3 { width:860px; padding:50px 50px 30px 50px; margin:0; position:absolute; left:calc(50% - 480px); top:10px; z-index:106; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; } .z-box-3::after { content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .left-zb3 { width:500px; padding:0; margin:0; position:relative; float:left; z-index:10; } .z-box-3 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:28px; line-height:34px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } .zb3-p1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:15px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p1 span { font-family: "Gilroy-B"; font-weight:normal; } .z-box-3 a.pdf { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:20px 0 0 45px; color:#317fb0; border-bottom:1px solid #317fb0; cursor:pointer; position:relative; display:inline-block; } .z-box-3 a.pdf:hover { border-bottom:1px solid rgba(0,0,0,0); } .z-box-3 a.pdf::after { content:''; width:26px; height:28px; padding:0; margin:0; cursor:pointer; background:url('../images/download.svg') no-repeat 0 0; position:absolute; top:-4px; left:-45px; z-index:auto; } .right-zb3 { width:330px; padding:0; margin:0; position:relative; float:right; z-index:10; } .big-img { width:100%; height:460px; overflow:hidden; padding:0; margin:0; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; z-index:10; cursor:pointer; } .small-img { width:45px; height:63px; overflow:hidden; padding:0; margin:10px 5px 0 5px; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; float:left; z-index:10; cursor:pointer; } .big-img img, .small-img img { width:100%; padding:0; margin:0; display:block; cursor:pointer; } .big-img::after, .small-img::after { content:''; width:100%; height:100%; padding:0; margin:0; background:#f0f0f0; position:absolute; top:0; left:0; z-index:auto; cursor:pointer; opacity:0; } .big-img:hover::after, .small-img:hover::after { opacity:0.25; } .big-img:hover::after, .big-img:not(:hover)::after, .small-img:hover::after, .small-img:not(:hover)::after { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3::before { content:''; width:100%; height:350px; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:2; background:#f6f6f6; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; } .bottom-zb3 { width:500px; padding:0; margin:100px 0 0 0; position:relative; float:left; z-index:10; } .z-box-3 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; position:relative; } .zb3-p2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0 0 0 35px; margin:5px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p2::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:-1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox-3 { width:330px; margin:100px 0 0 0; padding:0; text-align:center; position:relative; float:right; z-index:10; } .formbox-3 input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:22px 30px 18px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-3 input:-moz-placeholder {color:#37759e; } .formbox-3 input::-webkit-input-placeholder { color:#37759e; } .formbox-3 input.error:-moz-placeholder { color:#db264c; } .formbox-3 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-3 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0 0 0 20px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a:hover { color:#37759e; } .checkbox-3 input[type=checkbox] { display:none; } .checkbox-3 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-20px; top:-2px; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-3 label::before { content: ""; position: absolute; z-index:12; top:5px; left:-12px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-3 input[type=checkbox]:checked + label::before { display:block; } .formbox-3 .submit { width:100%; height:70px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-3 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:72px; width:100%; height:70px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-3 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-3 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-3 .submit input:hover, .formbox-3 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3 h6 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:34px; padding:0; margin:10px 0 0 0; color:#1c597f; cursor:default; position:relative; } .z-box-3 h6 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:30px; line-height:34px; padding:0; margin:0; color:#1c597f; cursor:pointer; position:relative; } } @media all and (max-width: 1020px) { .z-box-3 { width:560px; padding:50px calc(50% - 280px) 30px calc(50% - 280px); margin:0; position:absolute; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .z-box-3::after { display:none; content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .left-zb3 { width:100%; padding:0; margin:0; position:relative; float:none; z-index:10; } .z-box-3 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:28px; line-height:34px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } .zb3-p1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:15px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p1 span { font-family: "Gilroy-B"; font-weight:normal; } .z-box-3 a.pdf { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:20px; padding:0; margin:20px 0 0 45px; color:#317fb0; border-bottom:1px solid #317fb0; cursor:pointer; position:relative; display:inline-block; } .z-box-3 a.pdf:hover { border-bottom:1px solid rgba(0,0,0,0); } .z-box-3 a.pdf::after { content:''; width:26px; height:28px; padding:0; margin:0; cursor:pointer; background:url('../images/download.svg') no-repeat 0 0; position:absolute; top:-4px; left:-45px; z-index:auto; } .right-zb3 { width:100%; padding:0; margin:30px 0 0 0; position:relative; float:none; z-index:10; } .big-img { width:102px; height:135px; overflow:hidden; padding:0; margin:10px 5px 0 5px; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; z-index:10; cursor:pointer; float:left; } .small-img { width:102px; height:135px; overflow:hidden; padding:0; margin:10px 5px 0 5px; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; float:left; z-index:10; cursor:pointer; } .big-img img, .small-img img { width:100%; padding:0; margin:0; display:block; cursor:pointer; } .big-img::after, .small-img::after { content:''; width:100%; height:100%; padding:0; margin:0; background:#f0f0f0; position:absolute; top:0; left:0; z-index:auto; cursor:pointer; opacity:0; } .big-img:hover::after, .small-img:hover::after { opacity:0.25; } .big-img:hover::after, .big-img:not(:hover)::after, .small-img:hover::after, .small-img:not(:hover)::after { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3::before { content:''; width:100%; height:515px; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:2; background:#f6f6f6; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; } .bottom-zb3 { width:100%; padding:0; margin:100px 0 0 0; position:relative; float:none; z-index:10; } .z-box-3 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; padding:0; margin:0 0 20px 0; color:#136394; cursor:default; position:relative; } .zb3-p2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; max-width:430px; padding:0 0 0 35px; margin:5px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .zb3-p2::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:-1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox-3 { width:330px; margin:30px auto 0 auto; padding:0; text-align:center; position:relative; float:none; z-index:10; } .formbox-3 input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:22px 30px 18px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-3 input:-moz-placeholder {color:#37759e; } .formbox-3 input::-webkit-input-placeholder { color:#37759e; } .formbox-3 input.error:-moz-placeholder { color:#db264c; } .formbox-3 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-3 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0 0 0 20px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a:hover { color:#37759e; } .checkbox-3 input[type=checkbox] { display:none; } .checkbox-3 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-20px; top:-2px; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-3 label::before { content: ""; position: absolute; z-index:12; top:5px; left:-12px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-3 input[type=checkbox]:checked + label::before { display:block; } .formbox-3 .submit { width:100%; height:70px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-3 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:72px; width:100%; height:70px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-3 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-3 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-3 .submit input:hover, .formbox-3 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3 h6 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:34px; padding:0; margin:10px 0 0 0; color:#1c597f; cursor:default; position:relative; } .z-box-3 h6 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:30px; line-height:34px; padding:0; margin:0; color:#1c597f; cursor:pointer; position:relative; } } @media all and (max-width: 720px) { .z-box-3 { width:100%; padding:50px 0 30px 0; margin:0; position:absolute; left:0; top:0; z-index:106; background:#ffffff; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -khtml-border-radius:0; } .z-box-3::after { display:none; content:''; width:calc(100% - 60px); height:10px; padding:0; margin:0; position:absolute; left:30px; bottom:-10px; z-index:-1; background:#e7e7e7; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; -moz-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1); } .left-zb3 { width:360px; padding:0; margin:0 auto; position:relative; float:none; z-index:10; } .z-box-3 h2 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:0; color:#136394; cursor:default; position:relative; } .zb3-p1 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:15px 0 0 0; color:#4d4d4d; cursor:default; position:relative; } .zb3-p1 span { font-family: "Gilroy-B"; font-weight:normal; } .z-box-3 a.pdf { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:18px; padding:0; margin:20px 0 0 35px; color:#317fb0; border-bottom:1px solid #317fb0; cursor:pointer; position:relative; display:inline-block; } .z-box-3 a.pdf:hover { border-bottom:1px solid rgba(0,0,0,0); } .z-box-3 a.pdf::after { content:''; width:20px; height:22px; padding:0; margin:0; cursor:pointer; background:url('../images/download.svg') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:-4px; left:-35px; z-index:auto; } .right-zb3 { width:360px; padding:0; margin:20px auto 0 auto; position:relative; float:none; z-index:10; } .big-img { width:62px; height:85px; overflow:hidden; padding:0; margin:10px 10px 0 0; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; z-index:10; cursor:pointer; float:left; } .small-img { width:62px; height:85px; overflow:hidden; padding:0; margin:10px 10px 0 0; outline:1px solid #f0f0f0; background:#f0f0f0; position:relative; display:block; float:left; z-index:10; cursor:pointer; } .big-img img, .small-img img { width:100%; padding:0; margin:0; display:block; cursor:pointer; } .big-img::after, .small-img::after { content:''; width:100%; height:100%; padding:0; margin:0; background:#f0f0f0; position:absolute; top:0; left:0; z-index:auto; cursor:pointer; opacity:0; } .big-img:hover::after, .small-img:hover::after { opacity:0.25; } .big-img:hover::after, .big-img:not(:hover)::after, .small-img:hover::after, .small-img:not(:hover)::after { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3::before { content:''; width:100%; height:595px; padding:0; margin:0; position:absolute; left:0; bottom:0; z-index:2; background:#f6f6f6; border-top-right-radius:0; -webkit-border-top-right-radius:0; -moz-border-top-right-radius:0; -khtml-border-top-right-radius:0; border-top-left-radius:0; -webkit-border-top-left-radius:0; -moz-border-top-left-radius:0; -khtml-border-top-left-radius:0; border-bottom-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-bottom-right-radius:10px; -khtml-border-bottom-right-radius:10px; border-bottom-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-bottom-left-radius:10px; -khtml-border-bottom-left-radius:10px; } .bottom-zb3 { width:360px; padding:0; margin:80px auto 0 auto; position:relative; float:none; z-index:10; } .z-box-3 h3 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:20px; line-height:26px; max-width:310px; padding:0; margin:0 auto 20px auto; color:#136394; cursor:default; position:relative; } .zb3-p2 { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; max-width:430px; padding:0 0 0 35px; margin:5px auto 0 auto; color:#4d4d4d; cursor:default; position:relative; } .zb3-p2::after { content:''; width:24px; height:24px; padding:0; margin:0; cursor:default; background:url('../images/5.svg') no-repeat center 9px #317fb0; -webkit-background-size: 10px auto; -moz-background-size: 10px auto; -o-background-size: 10px auto; background-size: 10px auto; position:absolute; top:-1px; left:0; z-index:auto; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; } .formbox-3 { width:330px; margin:30px auto 0 auto; padding:0; text-align:center; position:relative; float:none; z-index:10; } .formbox-3 input { font-family: "Montserrat-B"; font-weight:normal; font-size:18px; line-height:30px; text-indent:0; text-transform:uppercase; text-align:center; width:calc(100% - 60px); height:30px; padding:22px 30px 18px 30px; border:none; margin:0; float:left; color:#37759e; outline:none; -webkit-appearance: none; -moz-appearance:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; background:#f0f0f0; } .formbox-3 input:-moz-placeholder {color:#37759e; } .formbox-3 input::-webkit-input-placeholder { color:#37759e; } .formbox-3 input.error:-moz-placeholder { color:#db264c; } .formbox-3 input.error::-webkit-input-placeholder { color:#db264c; } .formbox-3 input.error { color:#db264c; border-color:#db264c; } input::-webkit-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input::-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-moz-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:-ms-input-placeholder {opacity: 1; transition: opacity 0.3s ease;} input:focus::-webkit-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus::-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-moz-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} input:focus:-ms-input-placeholder {opacity: 0.3; transition: opacity 0.3s ease;} .checkbox-3 { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0 0 0 20px; margin:15px auto 0 auto; display:inline-block; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 a:hover { color:#37759e; } .checkbox-3 input[type=checkbox] { display:none; } .checkbox-3 label { font-family: "Montserrat-R"; font-weight:normal; font-style:normal; text-align:left; font-size:11px; line-height:18px; padding:0; margin:0; color:#5e5e5e; cursor:pointer; position:relative; } .checkbox-3 label:after { content:''; display:block; outline:none; border:1px solid #5e5e5e; width:14px; height:14px; padding:0; margin:0; position:absolute; left:-20px; top:-2px; z-index:11; cursor:pointer; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; } .checkbox-3 label::before { content: ""; position: absolute; z-index:12; top:5px; left:-12px; width:5px; height:5px; border-top: 1px solid #000000; border-left: 1px solid #000000; -webkit-transform: translate(-50%,-50%) rotate(-135deg); transform: translate(-50%,-50%) rotate(-135deg); transition: opacity .35s; display:none; } .checkbox-3 input[type=checkbox]:checked + label::before { display:block; } .formbox-3 .submit { width:100%; height:70px; padding:0; margin:15px 0 0 0; outline:none; border:none; cursor:pointer; background:none; position:relative; } .formbox-3 .submit input { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:inherit; font-size:18px; line-height:72px; width:100%; height:70px; padding:0; margin:0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; } .formbox-3 .submit input:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } .formbox-3 .submit input:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } .formbox-3 .submit input:hover, .formbox-3 .submit input:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } .z-box-3 h6 { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:34px; padding:0; margin:10px 0 0 0; color:#1c597f; cursor:default; position:relative; } .z-box-3 h6 a { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:30px; line-height:34px; padding:0; margin:0; color:#1c597f; cursor:pointer; position:relative; } } /* policy */ #policy-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #policy { width:1110px; padding:180px 0 100px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #policy h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:48px; line-height:60px; padding:0; margin:0; color:#136394; cursor:default; } #policy p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:30px; padding:0; margin:30px 0 0 0; color:#4d4d4d; cursor:default; } a.policy-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:80px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.policy-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.policy-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.policy-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.policy-button:hover, a.policy-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { #policy-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #policy { width:960px; padding:170px 0 90px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #policy h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #policy p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:30px 0 0 0; color:#4d4d4d; cursor:default; } a.policy-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:70px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.policy-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.policy-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.policy-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.policy-button:hover, a.policy-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #policy-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #policy { width:660px; padding:200px 0 90px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #policy h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:0; margin:0; color:#136394; cursor:default; } #policy p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:26px; padding:0; margin:30px 0 0 0; color:#4d4d4d; cursor:default; } a.policy-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:70px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.policy-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.policy-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.policy-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.policy-button:hover, a.policy-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #policy-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #policy { width:360px; padding:150px 0 70px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #policy h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:24px; line-height:30px; padding:0; margin:0; color:#136394; cursor:default; } #policy p { font-family: "Gilroy-R"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:24px; padding:0; margin:30px 0 0 0; color:#4d4d4d; cursor:default; } a.policy-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:40px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.policy-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:30px; z-index:auto; } a.policy-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.policy-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.policy-button:hover, a.policy-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* error */ #error-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #error { width:1110px; padding:250px 0 200px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #error h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/404.png') no-repeat top center; } #error p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:30px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.error-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:70px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.error-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.error-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.error-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.error-button:hover, a.error-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { #error-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #error { width:960px; padding:230px 0 180px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #error h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/404.png') no-repeat top center; } #error p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:24px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.error-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:70px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.error-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.error-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.error-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.error-button:hover, a.error-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 1020px) { #error-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #error { width:660px; padding:230px 0 180px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #error h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/404.png') no-repeat top center; } #error p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:24px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.error-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:60px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.error-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.error-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.error-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.error-button:hover, a.error-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } .br361 { display:none; } @media all and (max-width: 720px) { .br361 { display:block; } #error-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #error { width:360px; padding:180px 0 100px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #error h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:160px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/404.png') no-repeat top center; } #error p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; max-width:210px; padding:0; margin:20px auto 0 auto; color:#333333; cursor:default; } a.error-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:40px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.error-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:30px; z-index:auto; } a.error-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.error-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.error-button:hover, a.error-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } /* thnx */ #thnx-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #thnx { width:1110px; padding:220px 0 200px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #thnx h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:48px; line-height:60px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/correct.png') no-repeat top center; -webkit-background-size: 128px auto; -moz-background-size: 128px auto; -o-background-size: 128px auto; background-size: 128px auto; } #thnx p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:24px; line-height:30px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.thnx-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:24px; line-height:97px; width:420px; height:95px; padding:0 0 0 50px; margin:70px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.thnx-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.thnx-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.thnx-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.thnx-button:hover, a.thnx-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } @media all and (max-width: 1200px) { #thnx-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #thnx { width:960px; padding:205px 0 180px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #thnx h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/correct.png') no-repeat top center; -webkit-background-size: 128px auto; -moz-background-size: 128px auto; -o-background-size: 128px auto; background-size: 128px auto; } #thnx p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:24px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.thnx-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:70px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.thnx-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.thnx-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.thnx-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.thnx-button:hover, a.thnx-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } .br362 { display:none; } @media all and (max-width: 1020px) { .br362 { display:block; } #thnx-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #thnx { width:660px; padding:230px 0 180px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #thnx h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:40px; line-height:50px; padding:180px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/correct.png') no-repeat top center; -webkit-background-size: 128px auto; -moz-background-size: 128px auto; -o-background-size: 128px auto; background-size: 128px auto; } #thnx p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:20px; line-height:24px; padding:0; margin:25px 0 0 0; color:#333333; cursor:default; } a.thnx-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:20px; line-height:97px; width:380px; height:95px; padding:0 0 0 50px; margin:60px auto 0 auto; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.thnx-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:50px; z-index:auto; } a.thnx-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.thnx-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.thnx-button:hover, a.thnx-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } @media all and (max-width: 720px) { #thnx-w { width:100%; padding:0; margin:0; position:relative; background:#ffffff; } #thnx { width:360px; padding:180px 0 100px 0; margin:0 auto; position:relative; text-align:left; z-index:5; } #thnx h2 { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-size:30px; line-height:36px; padding:160px 0 0 0; margin:0 auto; color:#136394; cursor:default; background:url('../images/correct.png') no-repeat top center; -webkit-background-size: 128px auto; -moz-background-size: 128px auto; -o-background-size: 128px auto; background-size: 128px auto; } #thnx p { font-family: "Gilroy-B"; font-weight:normal; font-style:normal; text-align:center; font-size:18px; line-height:24px; max-width:300px; padding:0; margin:20px auto 0 auto; color:#333333; cursor:default; } #thnx p br { display:none; } a.thnx-button { font-family: "Montserrat-B"; font-weight:normal; font-style:normal; text-align:left; font-size:18px; line-height:82px; width:330px; height:80px; padding:0 0 0 30px; margin:40px 0 0 0; outline:none; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; color:#ffffff; background-image: linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -webkit-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -moz-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -o-linear-gradient(to bottom, #2d82b8, #3f6684); background-image: -ms-linear-gradient(to bottom, #2d82b8, #3f6684); border:none; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; position:relative; display:block; } a.thnx-button::after { content:''; width:40px; height:37px; padding:0; margin:0; cursor:pointer; background:url('../images/home.png') no-repeat 0 0; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; position:absolute; top:calc(50% - 19px); right:30px; z-index:auto; } a.thnx-button:hover { background-image: linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -webkit-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -moz-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -o-linear-gradient(to bottom, #3f6684, #2d82b8); background-image: -ms-linear-gradient(to bottom, #3f6684, #2d82b8); outline:none; } a.thnx-button:active { background-image: linear-gradient(to bottom, #3f6684, #246f9e); background-image: -webkit-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -moz-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -o-linear-gradient(to bottom, #3f6684, #246f9e); background-image: -ms-linear-gradient(to bottom, #3f6684, #246f9e); outline:none; } a.thnx-button:hover, a.thnx-button:not(:hover) { -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; -ms-transition: All 0.2s ease; transition: All 0.2s ease; } } input.fn { display:none; } /* end */