body{ font-family:Tahoma,Geneva,sans-serif; } .jumbotron { background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); color: #ffffff; text-align: center; width: 100%; border-radius: 0px; } .ad-head{ margin-bottom: 20px; } .box{ border-radius: 5px; margin-bottom: 10px; background-color: #ecf0f1; } .box:hover{ box-shadow: 0px .5px .5px .5px rgba(0,0,0,0.26); } .box-head{ width: 100%; height: 50px; background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); border-radius: 5px 5px 0px 0px; color: #ffffff; } .box-head h3{ padding-top: 15px; font-size: 22px; } a:link { color:#000000; } a:visited { color:#000000; } a:hover { color:#0280CF; } a:active { color:#0280CF; } .description .d-content{ padding: 10px; color: #2c3e50; } .d-content h2{ font-size: 24px; color: #2c3e50; } .btn{ color: #ffffff; background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); border:0px; font-family:Tahoma,Geneva,sans-serif; transition: 0.5s; } .btn:hover{ box-shadow: none !important; outline: none !important; } .btn:focus{ box-shadow: none !important; outline: none !important; } .widgets-form{ padding: 20px; margin-left: 40px; padding-top: 30px; } .widgets-form label{ padding-left: 0px; padding-top: 5px; font-size:17px; } .widgets-form .row{ padding-bottom: 15px; } .w-btn{ margin-top: 5px; } .result-label{ padding: 9px; } .result{ background-color: #ffffff; border-radius: 5px; height: 40px; padding: 9px; } ::-moz-selection { /* Code for Firefox */ color: #ffffff; background-color:#ffc371; } ::selection { color: #ffffff; background-color: #9b59b6; } input::placeholder { font-family:Tahoma,Geneva,sans-serif; } .ad-slot{ width:100%; } .ad-slot ins{ margin-bottom:5px;} .foot-link:link, .foot-link:visited{ color:#fff; } /* Responsive Design Strat */ @media(max-width:1199px ){ .w-btn{ margin-left: 100px; margin-top: 5px; } .result{ font-size: 15px; } .copy span{ display: none; } } @media(max-width:991px ){ .w-btn{ margin-left: 50px; margin-top: 5px; } .result-label{ padding: 0px; padding-top: 5px; } .result{ font-size: 15px; margin-left: 10px; padding: 0px; } .widgets-form{ padding-top: 20px; margin-left: 0px; } .widgets-form label{ padding-left: 0px; padding-top: 8px; text-align: left; } .box-head h3{ font-size: 18px; } .copy span{ display: none; } } @media screen and (max-width: 768px) { .box-head h3{ font-size: 18px; } .widgets-form{ padding: 20px; margin-left: 0px; padding-top: 20px; } .widgets-form label{ padding-left: 0px; padding-top: 8px; text-align: left; } .widgets-form .row{ padding-bottom: 10px; } .w-btn{ margin-left: 0px; } .result-label{ padding: 9px; } footer { height: 40px; padding-top: 10px; margin-top: 0px; } footer p{ font-size: 14px; } footer .pull-left{ float: none; } footer .pull-right{ display: none; } .result{ margin-left: 0px; padding: 9px; } .copy{ padding: 15px; } .copy span{ display: inline-block; } } @media(max-width:360px ){ .jumbotron h2{ font-size: 22px; } footer p{ font-size: 11px; } } @media(max-width:320px ){ .box-head h3{ font-size: 17px; } } h2{ color: #ffffff; } input[type=range] { -webkit-appearance: none; margin: 10px 0; width: 80%; } input[type=range]:focus { outline: none; } input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 13px; cursor: pointer; animate: 0.2s; box-shadow: 0px 0px 0px #000000; background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); border-radius: 25px; border: 0px solid #000101; } input[type=range]::-webkit-slider-thumb { box-shadow: 0px 0px 0px #000000; border: 1px solid #616161; height: 18px; width: 30px; border-radius: 7px; background: #FFFFFF; cursor: pointer; -webkit-appearance: none; margin-top: -3px; } input[type=range]:focus::-webkit-slider-runnable-track { background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); } input[type=range]::-moz-range-track { width: 100%; height: 13px; cursor: pointer; animate: 0.2s; box-shadow: 0px 0px 0px #000000; background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); border-radius: 25px; border: 0px solid #000101; } input[type=range]::-moz-range-thumb { box-shadow: 0px 0px 0px #000000; border: 1px solid #616161; height: 18px; width: 30px; border-radius: 7px; background: #FFFFFF; cursor: pointer; } input[type=range]::-ms-track { width: 100%; height: 13px; cursor: pointer; animate: 0.2s; background: transparent; border-color: transparent; color: transparent; } input[type=range]::-ms-fill-lower { background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); border: 0px solid #000101; border-radius: 50px; box-shadow: 0px 0px 0px #000000; } input[type=range]::-ms-fill-upper { background: #9B59B6; border: 0px solid #000101; border-radius: 50px; box-shadow: 0px 0px 0px #000000; } input[type=range]::-ms-thumb { margin-top: 1px; box-shadow: 0px 0px 0px #000000; border: 1px solid #616161; height: 18px; width: 30px; border-radius: 7px; background: #FFFFFF; cursor: pointer; } input[type=range]:focus::-ms-fill-lower { background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); } input[type=range]:focus::-ms-fill-upper { background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); } .range-slider__value { display: inline-block; position: relative; width: 60px; color: #fff; line-height: 15px; text-align: center; border-radius: 3px; background: -webkit-linear-gradient(to bottom, #004e92, #000428); background: linear-gradient(to bottom, #004e92, #000428); padding: 5px 8px; margin-left: 3px; float:right; margin-top: 6px; &:after { position: absolute; top: 8px; left: -7px; width: 0; height: 0; border-top: 7px solid transparent; border-right: 7px solid #9b59b6; border-bottom: 7px solid transparent; content: ''; } }