/* --------------------------------  Primary style  -------------------------------- */ *, *::after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }  html { font-size: 62.5%; }  body { font-size: 1.6rem; font-family: "Open Sans", sans-serif; color: #2b3e51; background-color: #ffffff; }  a { color: #2c97de; text-decoration: none; }   .cd-form::after { clear: both; content: ""; display: table; }  .cd-form legend { padding-bottom: 10px; margin-bottom: 20px; font-size: 6rem; border-bottom: 1px solid #ecf0f1; line-height: 1; }  .cd-form h4, .cd-form .cd-label { font-size: 1.3rem; color: #777777; margin-bottom: 10px; } .cd-form .cd-label { display: block; } .cd-form input, .cd-form textarea, .cd-form select, .cd-form label { font-family: "Open Sans", sans-serif; font-size: 1.6rem; color: #2b3e51; } .cd-form input[type="text"], .cd-form input[type="email"], .cd-form textarea, .cd-form select, .cd-form legend { display: block; width: 100%; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .cd-form input[type="text"], .cd-form input[type="email"], .cd-form textarea, .cd-form select { /* general style for input elements */ padding: 12px; border: 1px solid #cfd9db; background-color: #ffffff; border-radius: .25em; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08); } .cd-form input[type="text"]:focus, .cd-form input[type="email"]:focus, .cd-form textarea:focus, .cd-form select:focus { outline: none; border-color: #2c97de; box-shadow: 0 0 5px rgba(44, 151, 222, 0.2); } .cd-form .cd-select { position: relative; } .cd-form .cd-select::after { content: ''; position: absolute; z-index: 1; right: 16px; top: 50%; margin-top: -8px; display: block; width: 16px; height: 16px; background: url("../img/cd-icon-arrow.svg") no-repeat center center; pointer-events: none; } .cd-form select { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); cursor: pointer; } .cd-form select::-ms-expand { display: none; } .cd-form .cd-form-list { margin-top: 16px; } .cd-form .cd-form-list::after { clear: both; content: ""; display: table; } .cd-form .cd-form-list li { display: inline-block; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin: 0 26px 16px 0; float: left; width: 100%; } .cd-form input[type=radio], .cd-form input[type=checkbox] { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); margin: 0; padding: 0; opacity: 0; z-index: 2; } .cd-form input[type="radio"] + label, .cd-form input[type="checkbox"] + label { padding-left: 24px; padding-top: 3px; } .cd-form input[type="radio"] + label::before, .cd-form input[type="radio"] + label::after, .cd-form input[type="checkbox"] + label::before, .cd-form input[type="checkbox"] + label::after { content: ''; display: block; position: absolute; left: 0; top: 50%; margin-top: -8px; width: 16px; height: 16px; } .cd-form input[type="radio"] + label::before, .cd-form input[type="checkbox"] + label::before { border: 1px solid #cfd9db; background: #ffffff; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08); } .cd-form input[type="radio"] + label::before, .cd-form input[type="radio"] + label::after { border-radius: 50%; } .cd-form input[type="checkbox"] + label::before, .cd-form input[type="checkbox"] + label::after { border-radius: .25em; } .cd-form input[type="radio"] + label::after, .cd-form input[type="checkbox"] + label::after { background-color: #9158d0; background-position: center center; background-repeat: no-repeat; box-shadow: 0 0 5px rgba(126, 80, 202, 0.65); display: none; } .cd-form input[type="radio"] + label::after { /* custom image for radio button */ background-image: url("../img/cd-icon-radio.svg"); } .cd-form input[type="checkbox"] + label::after { /* custom image for checkbox */ background-image: url("../img/cd-icon-check.svg"); } .cd-form input[type="radio"]:focus + label::before, .cd-form input[type="checkbox"]:focus + label::before { /* add focus effect for radio and check buttons */ box-shadow: 0 0 5px rgba(44, 151, 222, 0.6); } .cd-form input[type="radio"]:checked + label::after, .cd-form input[type="checkbox"]:checked + label::after { display: block; } .cd-form input[type="radio"]:checked + label::before, .cd-form input[type="radio"]:checked + label::after, .cd-form input[type="checkbox"]:checked + label::before, .cd-form input[type="checkbox"]:checked + label::after { -webkit-animation: cd-bounce 0.3s; -moz-animation: cd-bounce 0.3s; animation: cd-bounce 0.3s; } .cd-form textarea { min-height: 100px; resize: vertical; overflow: auto; margin-bottom: 30px; } .cd-form [type="submit"] { /* button style */ border: none; background: #4b426b; border-radius: .25em; padding: 10px 10px; color: #ffffff; font-weight: bold; float: right; cursor: pointer; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .no-touch .cd-form input[type="submit"]:hover { background: #42a2e1; } .cd-form input[type="submit"]:focus { outline: none; background: #2b3e51; } .cd-form input[type="submit"]:active { -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); }  .cd-form .error-message p { /* background: #e94b35; */ color: #5a5858; font-size: 2rem; /* text-align: center; */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* border-radius: .25em; */ /* padding: 16px; */ } .cd-form .error { border-color: #e94b35 !important; } @media only screen and (min-width: 600px) {  .cd-form legend + div { /* reduce margin-top for first form element after the legend */ margin-top: 20px; } .cd-form h4, .cd-form .cd-label { font-size: 1.4rem; margin-bottom: 10px; } .cd-form input[type="text"], .cd-form input[type="email"], .cd-form textarea, .cd-form select { padding: 16px; } }  @-webkit-keyframes cd-bounce { 0%, 100% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(0.8); } } @-moz-keyframes cd-bounce { 0%, 100% { -moz-transform: scale(1); } 50% { -moz-transform: scale(0.8); } } @keyframes cd-bounce { 0%, 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); transform: scale(0.8); } } /* --------------------------------  Custom icons  -------------------------------- */  .cd-form .icon input, .cd-form .icon select, .cd-form .icon textarea { /* padding-left: 54px !important; */ }  .col-md-6 {  float: left; } .featured-area legend { padding-bottom: 10px; margin-bottom: 20px; font-size: 5rem; border-bottom: 1px solid #ecf0f1; line-height: 1; margin-top: 30px; padding-top: 30px; } .parent.align-items-center { background: #6775dc0a; padding: 20px; } .service-area legend { padding-bottom: 10px; margin-bottom: 20px; font-size: 3rem; border-bottom: 1px solid #ecf0f1; line-height: 1; margin-top: 30px; padding-top: 50px; background: #4b426b; padding: 20px; text-align: center; font-weight: 400; color: #fff; } .featured-area  .error-message p { color: #5a5858; font-size: 2rem; -webkit-font-smoothing: antialiased; /*  -moz-osx-font-smoothing: grayscale; */ } .container{margin-bottom:20px;} .single-service .submit{ border: none; background: #ffffff; border-radius: .25em; padding: 20px 40px; color: #5f44c0; font-weight: bold; margin: 0 auto; font-size: 2em; text-align: center; position: relative; opacity: 1; width: 100%; float: center; z-index: 99999; cursor: pointer; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* -webkit-appearance: none; */ -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } /* --------------------------------  FLoating labels  -------------------------------- */   .features-img{vertical-align:middle;width:100%;margin:0 auto}   .js .floating-labels div { margin: 28px 0; } .js .floating-labels .cd-label { position: absolute; top: 16px; left: 16px; font-size: 1.6rem; cursor: text; -webkit-transition: top 0.2s, left 0.2s, font-size 0.2s; -moz-transition: top 0.2s, left 0.2s, font-size 0.2s; transition: top 0.2s, left 0.2s, font-size 0.2s; } .js .floating-labels .icon .cd-label { left: 56px; } .js .floating-labels .cd-label.float { /* move label out the input field */ font-size: 1.2rem; top: -16px; left: 0 !important; } @media only screen and (min-width: 600px) { .js .floating-labels legend + div { /* reduce margin-top for first form element after the legend */ margin-top: 16px; } .js .floating-labels .cd-label { top: 20px; } } /*------------------------------------*\ Contact \*------------------------------------*/  .contact { margin: 15px 0px; text-align: center; }  .contact i { font-size: 36px; color: #6195FF; margin-bottom: 20px; }  .contact-form { text-align: center; margin-top: 40px; }  .contact-form .input { margin-bottom: 20px; }   .contact-form .input:nth-child(1), .contact-form .input:nth-child(2) { width: calc(50% - 10px); }  .contact-form .input:nth-child(2) { margin-left: 15px; } .section-header .title { text-transform: capitalize; } h2 { font-size: 36px; } .section-header { position: relative; margin-bottom: 60px; } .section-header.text-center { width: 100%; } .ex-overlay{ width: 100%; height: 100%; position: absolute; background: #292b2c36; } .ex-title{ position: absolute; bottom: 60px; text-align: center; width: 100%; height: 47px; padding: 0 22px; font-size: 2.5em; line-height: 1.4em; }   .ribbon { width: 110px; height: 110px; overflow: hidden; position: absolute; } .ribbon::before, .ribbon::after { position: absolute; z-index: -1; content: ''; display: block; border: 5px solid #2980b9; } .ribbon span { position: absolute; display: block; width: 225px; padding: 12px 0; background-color: #3498db; box-shadow: 0 5px 10px rgba(0,0,0,.1); color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.2); text-transform: uppercase; text-align: center; line-height: 0; font-size: 12px; }  /* top left*/ .ribbon-top-left { top: 20px; left: 5px; z-index: 2; } .ribbon-top-left::before, .ribbon-top-left::after { border-top-color: transparent; border-left-color: transparent; } .ribbon-top-left::before { top: 0; right: 29px; } .ribbon-top-left::after { bottom: 29px; left: 0; } .ribbon-top-left span { right: -25px; top: 30px; transform: rotate(-45deg); padding-left: 25px; }