/* Add here all your CSS customizations */


#body-home #header.psi-default{
    position : absolute;
}

.tp-rightarrow.custom-arrows-style-1:after, .tp-leftarrow.custom-arrows-style-1:after{
    width: 0px;
}

.rev_slider li.slide-overlay .slotholder:after {
    width: 100%;
    height: 100%;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0.9;
    background: rgb(0,0,0,0.27);
    z-index: 2;
}


/*custom info circular widget begins*/

.container-tweenmax {
    width: 100%;
    height: 520px;
}

#learn-more {
    fill-opacity: 0;
    fill: #fff;
    stroke: #fff;
    stroke-width: 2;
    border-radius: 5px;
    stroke-linejoin: round;
    -webkit-transition: all 250ms ease-in;
    transition: all 250ms ease-in;
    cursor: pointer;
}
#learn-more:hover {
    fill-opacity: 1;
}
#learn-more:hover ~ .learn-more-text {
    fill: #005fa4;
}

.learn-more-text {
    font-family: 'Roboto';
    fill: #fff;
    pointer-events: none;
    font-size: 14px;
    -webkit-transition: all 250ms ease-in;
    transition: all 250ms ease-in;
}

.center {
    fill: #005fa4;
}

.pointer {
    fill: #fff;
    stroke: #3b8fc0;
    stroke-width: 2;
}

.nav-copy {
    font-family: 'Roboto';
    fill: #fff;
    fill-opacity: 1;
    -webkit-transition: all 250ms ease-in;
    transition: all 250ms ease-in;
}
.nav-copy.changing {
    fill-opacity: 0;
}

.service {
    cursor: pointer;
}
.service text {
    font-size: 14px;
    font-family: 'Roboto';
    text-anchor: middle;
}
.service .icon-wrapper {
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.service .icon-wrapper, .service .icon-wrapper > * {
    -webkit-transition: all 250ms ease-in;
    transition: all 250ms ease-in;
}
.service circle {
    fill: #005fa4;
}
.service circle.shadow {
    fill-opacity: 0;
    -webkit-filter: url(#service-shadow);
    filter: url(#service-shadow);
}
.service use {
    fill: #fff;
}
.service text {
    fill: #4d4d4d;
}
.service.active .icon-wrapper, .service:hover .icon-wrapper {
    -webkit-transform: scale(1.15) translateY(-5px);
    transform: scale(1.15) translateY(-5px);
}
.service.active .icon-wrapper, .service.active .icon-wrapper > *, .service:hover .icon-wrapper, .service:hover .icon-wrapper > * {
    -webkit-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}
.service.active .icon-wrapper circle.shadow, .service:hover .icon-wrapper circle.shadow {
    fill-opacity: 0.4;
}
.service.active text, .service:hover text {
    fill: #005fa4;
    font-weight: bold;
}

.img-icon{
    width: 150px;
    height: auto;
}


.font-color-theme-dark{
    color : #196a9e;
}
.font-color-theme-dark-hover:hover .font-hover{
    color:#196a9e !important;
}

.img-greyscale img{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

.img-greyscale:hover img{
    filter: none;
    -webkit-filter: grayscale(0%);
}

.img-greyscale:hover .btn-primary{
    background-color: #1970a0;
    border-color: #1970a0;
    color: #FFF;
}

/*custom info circular widget ends*/


.page-header.bg-color-dark .breadcrumb a{
    color : #2291ce;
}

.page-header.bg-color-dark .breadcrumb > li{
    color : #fff;
}


.psi-style-1 .thumb-info .thumb-info-inner{
    text-transform: capitalize;
    font-size: 1.35em;   
}

.psi-style-1 .thumb-info.thumb-info-hide-info-hover .thumb-info-type{
    letter-spacing: 0.125em;
}

.sidebar-products .main-li ul{
    display: none;
}

.sidebar-products .main-li ul{
    display: none;
}
.sidebar-products .main-li.view-selection ul{
    display: block;
}

.sidebar-products .view-selection ul li a.active{
    color : #1c85bf;
}

.giant-toggle label{
    font-size: 1.2em !important;
}

.giant-toggle.toggle .toggle > label{
    padding: 20px 0 20px 40px;
}

.giant-toggle .toggle > label:before{
    left: 14px;
    right: 0;
}

.giant-toggle .toggle > label:before{
    width: 12px;
    height: 12px;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.giant-toggle .toggle > label:before {
    border-top: 2px solid;
    border-right: 2px solid;
}

.giant-toggle.toggle-minimal .toggle:nth-of-type(odd) label{
    background: #f3f8ff;
}

.giant-toggle.toggle-minimal .toggle > label{
    border: none;
}

.giant-toggle .toggle-content > div ul.columnize{
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}

.psi-image-hotspots.image-hotspots .circle{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 40px;
    height: 40px;
    margin: -0.666em auto auto -0.666em;
    background: #CCC;
    border-radius: 50%;
    opacity: 0.75;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: opacity .2s ease-in, -webkit-transform .1s ease-out;
    transition: opacity .2s ease-in, -webkit-transform .1s ease-out;
    transition: opacity .2s ease-in, transform .1s ease-out;
    transition: opacity .2s ease-in, transform .1s ease-out, -webkit-transform .1s ease-out;
    color: white;
    font-size: 1.5em;
    padding: 0;
    text-align: center;
    line-height: 28px;
    overflow: hidden;
}

.psi-image-hotspots .circle{
    background : #230eb5 !important;
}

.psi-image-hotspots .image-hotspot .ring{
    border: 1px solid #230eb5;
}



/*color picker begins*/

.colors {
    text-align: left;
    padding-top: 20px;
}
.colors > li{
    list-style: none;
    display: inline-block;
}
.colors > li .color-scheme{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border-bottom: 5px solid rgba(0, 0, 0, 0.1);
    margin: 0 10px;
    transition-duration: .2s;
    box-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
    cursor: pointer;
}
.colors .color-caption, .colors .color-scheme{
    display: block;
}
.color-caption b{
    font-family: "Open Sans", Verdana;
}
.color-caption{
    font-size: 12px;
    text-align: center;
}
.colors > li:hover .color-scheme {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    border-bottom: 10px solid rgba(0, 0, 0, 0.15);
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
.colors > li .active-color {
    -webkit-transform: scale(1.2) translateY(-10px);
    transform: scale(1.2) translateY(-10px);
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
    border-bottom: 20px solid rgba(0, 0, 0, 0.15);
}
.colors > li:nth-child(1) .color-scheme {
    background-color: #ffffff;
    border-bottom: 5px solid rgba(0, 0, 0, 0.04);
}
.colors > li:nth-child(2)  .color-scheme{
    background-color: #faef44;
}
.colors > li:nth-child(3) .color-scheme {
    background-color: #c11f25;
}
.colors > li:nth-child(4) .color-scheme {
    background-color: #098953;
}
.colors > li:nth-child(5) .color-scheme {
    background-color: #0a5282;
}
.colors > li:nth-child(6) .color-scheme {
    background-color: #d1d7d4;
}
.colors > li:nth-child(7) .color-scheme {
    background-color: #85898b;
}
.colors > li:nth-child(8) .color-scheme {
    background-color: #2f454d;
}
.colors > li:nth-child(9) .color-scheme {
    background-color: #621a20;
}
.colors > li:nth-child(10) .color-scheme {
    background: url(../img/products/doors/pe-swing-doors/granite.jpg) repeat;
    background-size: cover; 

}
.colors > li:nth-child(5) .color-scheme {
    background-color: #0a5282;
}
.colors > li:nth-child(5) .color-scheme {
    background-color: #0a5282;
}
.colors > li:nth-child(5) .color-scheme {
    background-color: #0a5282;
}
.colors > li:nth-child(5) .color-scheme {
    background-color: #0a5282;
}
.colors > li:nth-child(5) .color-scheme{
    background-color: #0a5282;
}


/*special colours*/

.colors.special > li:nth-child(1) .color-scheme {
    background-color: #da1f27;
    border-bottom: 5px solid rgba(0, 0, 0, 0.04);
}
.colors.special > li:nth-child(2)  .color-scheme{
    background-color: #0b5895;
}
.colors.special > li:nth-child(3) .color-scheme {
    background-color: #e85224;
}
.colors.special > li:nth-child(4) .color-scheme {
    background-color: #f9b217;
}
.colors.special > li:nth-child(5) .color-scheme {
    background-color: #186aa3;
}
.colors.special > li:nth-child(6) .color-scheme {
    background-color: #23255a;
}
.colors.special > li:nth-child(7) .color-scheme {
    background-color: #211519;
}
.thumb-info-caption{padding : 2rem 2.3rem !important;}

section.contact-details .feature-box p, section.contact-details .feature-box a{
    color : #fff;
}

section.contact-details {
    border: none;
    margin: 0;
}



.form .form-control {
    border: 1px solid #9e9e9e;
    border-radius: 2px;
    height: 45px;
    padding: 10px 12px;
}
.form .form-control::-webkit-input-placeholder {
    text-transform: uppercase;
}
.form .form-control::-moz-placeholder {
    text-transform: uppercase;
}
.form .form-control:-ms-input-placeholder {
    text-transform: uppercase;
}
.form .form-control:-moz-placeholder {
    text-transform: uppercase;
}
.form textarea.form-control {
    height: auto;
}
.form input[type="submit"] {
    border-radius: 25px;
    padding: 11px 21px;
    border-width: 2px;
    font-size: 1em;
}

.font-color-light{
    color : #fff;
}

.testimonial blockquote.no-quotes:before{
    content:"" !important;
}

.font-color-white, .font-color-white *{
    color : #fff;
}

html body .btn-white, html body .btn-outline.btn-white{
    color : #fff;
    border-color: #FFF;
}

html .btn-with-arrow.btn-white span{
    background-color: #fff;
    -webkit-box-shadow: 2px 3px 18px -3px #FFF;
    box-shadow: 2px 3px 18px -3px rgb(57 57 57 / 40%);
}

.btn-with-arrow.btn-white i {
    color: #1c85bf;
}

html .overlay-color-quaternary:not(.no-skin):before{
    background-color: transparent !important;
}

.bg-dark-transparent{
    background: rgba(23,56,101,0.88);
}

.header-theme-1 .bg-header-theme{
    background-blend-mode: multiply;
    background-image: linear-gradient(to right, rgba(23,45,101,0.86) 0%, rgba(81,178,229,0.80) 100%), url(../img/about-us/main-banner-bw.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 90px 0;
}

.header-theme-2 .bg-header-theme{
    background-image: url('../img/about-us/main-banner-original.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.header-theme-3 .bg-header-theme, .header-theme-4 .bg-header-theme{
    background-blend-mode: multiply;
    background-image: url('../img/about-us/main-banner.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

html .header-theme-4 .bg-color-dark, html .bg-dark{
    background-color: #333333 !important;
}

.header-theme-2 .bg-header-text, .header-theme-3 .bg-header-text, .header-theme-4 .bg-header-text{
    /*background: rgba(23,56,101,0.70);*/    
}

.list.list-icons li > i[class*="fa-"]{
    top : 2px !important;
}


html .featured-boxes-full-scale > .featured-box-full-primary:nth-child(1){
    background-color: #3e72a8;
}

html .featured-boxes-full-scale > .featured-box-full-primary:nth-child(2) {
    background-color: #6686b0;
}

html .featured-boxes-full-scale > .featured-box-full-primary:nth-child(3) {
    background-color: #224b83;
}

html .featured-boxes-full-scale > .featured-box-full-primary:nth-child(4) {
    background-color: #3b5f8f;
}

.cursor-default, .cursor-default *{
    cursor : default !important;
}
.cursor-pointer, .cursor-pointer *{
    cursor : pointer !important;
}


.background-1 {
    background: #173865;
    background-image: -webkit-radial-gradient(top, circle cover, #408fb7 0%, #204c88 80%);
    background-image: -moz-radial-gradient(top, circle cover, #408fb7 0%, #252233 80%);
    background-image: -o-radial-gradient(top, circle cover, #408fb7 0%, #252233 80%);
    background-image: radial-gradient(top, circle cover, #408fb7 0%, #252233 80%);
}


.sort-source.sort-source-style-3 > li > a {
    border-right: 2px #cbe2ed solid;
}

.sort-source.sort-source-style-3 > li:first-child > a {
    border-left: 2px #cbe2ed solid;
}

.sort-source.sort-source-style-3 > li.active > a{
    font-weight: 700;
    background: #1c85bf !important;
    border: 0;
    color: #ffffff !important;
}


/*transparent-header-menu theme 2 index-2.php */

.transparent-header-menu .custom-transparent-header .social-icons li a,  .transparent-header-menu #header .header-nav.header-nav-links nav > ul > li > a{
    color : #fff !important;
}

.sticky-header-active .transparent-header-menu .custom-transparent-header .social-icons li a,  .sticky-header-active .transparent-header-menu #header .header-nav.header-nav-links nav > ul > li > a{
    color : #000 !important;
}

.transparent-header-menu .logo-img-light{
    display: block;
}
.sticky-header-active .transparent-header-menu .logo-img-dark{
    display: block !important;
}

.transparent-header-menu .logo-img-dark{
    display: none;
}
.sticky-header-active .transparent-header-menu  .logo-img-light{
    display: none !important;
}
html:not(.sticky-header-active) #header.header-transparent:not(.header-semi-transparent) .header-body.custom-transparent-header {
    background: rgba(0,0,0,0.15) !important;    
}

.owl-carousel .owl-nav button.owl-next:before{
    content: '';
    position: absolute;
    top: 50%;
    left: 40%;
    width: 30px;
    height: 30px;
    border-top: 1px solid #FFF;
    border-left: 1px solid #FFF;
    -webkit-transform: translate3d(-50%, -50%, 0) rotate(135deg);
    transform: translate3d(-50%, -50%, 0) rotate(135deg);

}

.owl-carousel .owl-nav button.owl-prev:before{
    content: '';
    position: absolute;
    top: 50%;
    left: 60%;
    width: 30px;
    height: 30px;
    border-top: 1px solid #FFF;
    border-left: 1px solid #FFF;
    -webkit-transform: translate3d(-50%, -50%, 0) rotate(-45deg);
    transform: translate3d(-50%, -50%, 0) rotate(-45deg);
}


.owl-carousel.nav-dark:not(.nav-style-1):not(.nav-style-2):not(.nav-style-3):not(.show-nav-title).nav-with-transparency .owl-nav button[class*="owl-"] {
    width: 50px;
    height: 50px;
    background-color: rgb(28 133 191) !important;
    border-color: transparent !important;
}


.owl-carousel .owl-nav{
    bottom: 25px;
    right: 0;
}

/*home option 6*/

.floating-bottom{
    position: absolute;
    bottom: 0;
    width: 100%;
}

@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}