html,body {height: 100%;}
a{color:#ce8952}
a:hover{color:#f29e08}
.margin{
margin-bottom:1rem;
}
.margin-vertical-10{height:10px}
.margin-vertical-20{height:20px}
.margin-vertical-30{height:30px}
.margin-vertical-40{height:40px}
.margin-vertical-50{height:50px}
.margin-vertical-60{height:60px}
.margin-vertical-70{height:70px}
.margin-vertical-80{height:80px}
.margin-vertical-90{height:90px}
.margin-vertical-100{height:100px}
/* .header{background-image:url(../images/header.jpg);background-size:cover;background-position:center;height: calc(100vh - 52px); min-height:300px;text-align:center;} */
/* .header
.header img{margin:auto} */
.sitename{text-align:center;font-size:60px;margin:20px 0;padding:0;background-image:linear-gradient(90deg, rgba(255,255,255,0),rgba(255,255,255,4),rgba(255,255,255,0) )}
.siteslogan{text-align:center;font-size:30px;margin:10px 0;background-image:linear-gradient(90deg, rgba(255,255,255,0),rgba(255,255,255,4),rgba(255,255,255,0) )}
/*navbar */
.top-fixed.affix{
position:fixed;
top:0;
right:0;
/* background:#161541; */
background:#0e247a;
z-index:1;
width:100%;
border-radius:0;
}
.navbar-main {
background-color: transparent;
border-color: transparent;
}
.navbar-main .navbar-brand {
/* color: #ce8952; */
color: #0e247a;
}
.navbar-main .navbar-brand img{
height:100%;
}
.navbar-main .navbar-brand:hover,
.navbar-main .navbar-brand:focus {
color: #f29e08;
}
.navbar-main .navbar-text {
color: #ffffff;
}
.navbar-main .navbar-nav > li > a {
/* color: #ce8952; */
color: #0e247a;
padding-top:8px;
padding-bottom:8px;
margin-top:8px;
transition:all .6s ease-in-out;
border-radius:20px;
}
.navbar-main .navbar-nav > li > a:hover,
.navbar-main .navbar-nav > li > a:focus {
color: #fff;
border-radius:20px;
background: linear-gradient(to right, #b76e3f, #dea162);
}
.navbar-main .navbar-nav > .active > a,
.navbar-main .navbar-nav > .active > a:hover,
.navbar-main .navbar-nav > .active > a:focus {
color: #fff;
border-radius:20px;
background: linear-gradient(to right, #b76e3f, #dea162);
}
.navbar-main .navbar-nav > .disabled > a,
.navbar-main .navbar-nav > .disabled > a:hover,
.navbar-main .navbar-nav > .disabled > a:focus {
color: #ccc;
background-color: transparent;
}
.navbar-main .navbar-toggle {
border-color: #ddd;
}
.navbar-main .navbar-toggle:hover,
.navbar-main .navbar-toggle:focus {
background-color: #ddd;
}
.navbar-main .navbar-toggle .icon-bar {
background-color: #888;
}
.navbar-main .navbar-collapse,
.navbar-main .navbar-form {
border-color: #e7e7e7;
}
.navbar-main .navbar-nav > .open > a,
.navbar-main .navbar-nav > .open > a:hover,
.navbar-main .navbar-nav > .open > a:focus {
background-color: #e7e7e7;
color: #555;
}
@media (max-width: 767px) {
.navbar-main .navbar-nav .open .dropdown-menu > li > a {
color: #777;
}
.navbar-main .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-main .navbar-nav .open .dropdown-menu > li > a:focus {
color: #333;
background-color: transparent;
}
.navbar-main .navbar-nav .open .dropdown-menu > .active > a,
.navbar-main .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-main .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #555;
background-color: #e7e7e7;
}
.navbar-main .navbar-nav .open .dropdown-menu > .disabled > a,
.navbar-main .navbar-nav .open .dropdown-menu > .disabled > a:hover,
.navbar-main .navbar-nav .open .dropdown-menu > .disabled > a:focus {
color: #ccc;
background-color: transparent;
}
}
.navbar-main .navbar-link {
color: #777;
}
.navbar-main .navbar-link:hover {
color: #333;
}
.navbar-main .btn-link {
color: #777;
}
.navbar-main .btn-link:hover,
.navbar-main .btn-link:focus {
color: #333;
}
.navbar-main .btn-link[disabled]:hover,
fieldset[disabled] .navbar-main .btn-link:hover,
.navbar-main .btn-link[disabled]:focus,
fieldset[disabled] .navbar-main .btn-link:focus {
color: #ccc;
}
/* navbar end */
.section1{background:url(../images/section1.jpg);background-attachment:fixed;background-size:cover;background-position:center;height:100vh;color:#fff;display:table;width:100%}
.section1 .container{display:table-cell;vertical-align;middle}
.section2 {
/* background:linear-gradient(to right, #b76e3f, #dea162); */
background-color:#0e247a;
color: #fff;
padding-bottom: 30px;
padding-top: 30px;
text-shadow:1pt 1pt #333;
}
.section3{background:url(../images/section3.jpg);background-attachment:fixed;background-size:cover;background-position:center;height:100vh;display:table;width:100%}
.section3 .container{display:table-cell;vertical-align;middle}
.section4 {
background: linear-gradient(to left, #262479, #7c4040);
color: #fff;
padding-bottom: 30px;
padding-top: 30px;
text-shadow:1pt 1pt #333;
}
.get-started-button{
border:3pt solid #ccc;
border-radius:4px;
padding:15px 20px;
font-size:20px;
transition: border-color .5s ease;
color:#fff;
}
.get-started-button:hover{
border:3pt solid #31abe5;
color:#fff;
text-decoration:none;
}
.section-blog-circle {
border: 5px solid #666;
border-radius: 50%;
box-shadow: 0 6px 1px 0 #bdbdbd;
padding-top:40px;
float: none;
height: 225px;
margin: auto;
text-align: center;
width: 225px;
transition: border-color .5s ease;
overflow:hidden;
}
.section-blog-circle:hover {
border: 5px solid #c7844e;
}
img.grayscale {
filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 3.5+ */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}
.section-blog-circle:hover img.grayscale {
filter: none;
-webkit-filter: grayscale(0%);
}
.marquee{border-radius:5px;-moz-box-shadow: inset 0 0 5px #000000;
-webkit-box-shadow: inset 0 0 5px #000000;
box-shadow: inset 0 0 5px #000000;overflow:hidden}
.marquee .inner{background:rgba(0,0,0,.2);border-radius:5px; white-space:nowrap; cursor:move;overflow:hidden;transition:background .2s ease}
.marquee .inner:hover{background:transparent;border-radius:5px; white-space:nowrap; cursor:move;overflow:hidden}
.payment-avatar{height: 35px;width: 35px;border: 2px solid #ffc000;border-radius: 20px;margin-right: 5px;}
.marquee .inner span {display: inline-block;list-style: outside none none;padding: 8px 12px;outline: none;font-size: 15px;}
.marquee .inner .single {border-right: 2px solid rgba(0,0,0,.2);}
ul.social {
margin:10px auto;
overflow:hidden; /* contain floats */
padding:0;
}
ul.social li {
float:left;
margin-right:10px;
position:relative;
text-align:center;
width:48px;
list-style:none;
/* Decrease this number to *increase* the 3D effect (and vice versa). */
perspective:250 !important;
}
/* .icon {
background:url(../images/social-icons.png);
background-position:-115px -1px;
display:inline-block;
height:48px;
width:48px;
background-repeat:no-repeat;
} */
ul.social li:nth-of-type(2n+2) .icon {
background:url(../images/social-icons.png);
background-position:0px 0px;
}
ul.social li:nth-of-type(2n+3) .icon {
background:url(../images/social-icons.png);
background-position:-58px -1px;
}
ul.social li:nth-of-type(2n+4) .icon {
background:url(../images/social-icons.png);
background-position:-172px -1px;
}
ul.social li:nth-of-type(2n+5) .icon {
background:url(../images/social-icons.png);
background-position:0px -178px;
}
ul.social li .label {
left:-5px;
position:absolute;
top:-5px;
}
/*===== Animation (ie: the good stuff) =====*/
ul.social li:hover .icon, ul.social li.label {
transform:translateZ(-32px) rotateY(180deg);
animation-duration:0.33s;
animation-name:rotateOut;
animation-timing-function:linear;
animation-fill-mode:forwards;
}
ul.social li .icon, ul.social li:hover .label {
animation-duration:0.33s;
animation-name:rotateIn;
animation-timing-function:linear;
animation-fill-mode:forwards;
}
@keyframes rotateIn {
0% {
opacity:0;
transform:translateZ(-100px) translateX(0) rotateY(180deg);
}
/*
We need to reset it back to negative to avoid it flipping around like crazy
Comment this line out to see what I mean.
*/
1% {
transform:translateZ(-100px) rotateY(-180deg);
}
50% {
opacity:0.5;
z-index:1;
transform:translateZ(-50px) translateX(-25px) rotateY(-90deg);
}
100% {
opacity:1;
z-index:1;
transform:translateZ(0) translateX(0) rotateY(0deg);
}
}
@keyframes rotateOut {
0% {
opacity:1;
transform:translateZ(0) translateX(0) rotateY(0deg);
}
50% {
opacity:0.5;
z-index:0;
transform:translateZ(-50px) translateX(25px) rotateY(90deg);
}
100% {
opacity:0;
z-index:0;
transform:translateZ(-100px) translateX(0) rotateY(180deg);
}
}
.panel-main {
border-color: #ce8c53;
}
.panel-main > .panel-heading {
color: #fff;
/*background-color: #ce8c53; */
background-color: #0e247a;
border-color: #ce8c53;
}
.panel-main > .panel-heading + .panel-collapse > .panel-body {
/* border-top-color: #ce8c53; */
border-top-color: #0e247a;
}
.panel-main > .panel-heading .badge {
/* color: ##0e247a; */
color: #0e247a;
background-color: #fff;
}
.panel-main > .panel-footer + .panel-collapse > .panel-body {
/* border-bottom-color: ##0e247a; */
border-bottom-color: #0e247a;
}
.btn-main {
color: #fff;
background: linear-gradient(to right, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main:focus,
.btn-main.focus {
color: #fff;
background: linear-gradient(to left, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main:hover {
color: #fff;
background: linear-gradient(to left, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main:active,
.btn-main.active,
.open > .dropdown-toggle.btn-main {
color: #fff;
background: linear-gradient(to left, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main:active:hover,
.btn-main.active:hover,
.open > .dropdown-toggle.btn-main:hover,
.btn-main:active:focus,
.btn-main.active:focus,
.open > .dropdown-toggle.btn-main:focus,
.btn-main:active.focus,
.btn-main.active.focus,
.open > .dropdown-toggle.btn-main.focus {
color: #fff;
background: linear-gradient(to left, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main:active,
.btn-main.active,
.open > .dropdown-toggle.btn-main {
background-image: none;
}
.btn-main.disabled:hover,
.btn-main[disabled]:hover,
fieldset[disabled] .btn-main:hover,
.btn-main.disabled:focus,
.btn-main[disabled]:focus,
fieldset[disabled] .btn-main:focus,
.btn-main.disabled.focus,
.btn-main[disabled].focus,
fieldset[disabled] .btn-main.focus {
background: linear-gradient(to left, #b76e3f, #dea162);
border-color: ##0e247a;
}
.btn-main .badge {
color: #ff6600;
background-color: ##0e247a;
}
.testimonial
{
margin-bottom:10px;
clear:both;
}
.testimonial .user{
border:1pt solid #ff6600;
border-radius:50%;
height:100px;
width:100px;
}
.test{
background:#8d9fe4;
padding:20px;
color:#fff;
font-size:20px;
position:relative;
border-radius:5px;
}
.test img.left{
position:absolute;
left:-17px;
top:0px;
}
.test img.right{
position:absolute;
right:-17px;
top:0px;
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
.testimonial footer{
color:#ff6600;
text-align:center;
}
.testimonial footer h4{
margin:0;
}
.test p:before {
font-family:FontAwesome;
content:"\f10d";
font-size:20px;
color:#fff;
margin-right:15px;
}
.input-group-addon i{color: ##0e247a !important;}