a{text-decoration:none} a:link, a:visited{color:#000} a:hover{color:#B00000} a:active{color:#FF0000} u{cursor:pointer} textarea, input[type="text"], input[type="button"], input[type="search"], input[type="submit"] { -webkit-appearance:none; border-radius:4px} input,optgroup,select,textarea {font-family:inherit;line-height:1.15;margin:0} input {overflow:visible} body .ui-button{font-weight:normal} textarea {overflow:auto} .zoomedcontainer, .lightwrap { contain:strict } .tiltturnbackbutton {text-align:left;margin-left:10px;} .mobiledetailscontainer {z-index:1;} .zoomedButtons,.zoomedimage,.zoomClose { will-change:opacity; transform:translateZ(0); } .zoomedcontainer, .zoomedimage,.zoomedimagecontainer { transform:translateZ(0); } .zoomedcontainer, .zoomedimage,.zoomedimagecontainer { will-change:left,transform,top,width,height; } .guidance.guidancedesktop {clip-path:polygon(0 0, 100% 0, 100% 1000%, 0% 1000%);} @font-face{ font-family:'opensansR'; src:url('/lib/fonts/NotoSans-Regular-webfont.eot'); src:url('/lib/fonts/NotoSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('/lib/fonts/NotoSans-Regular-webfont.woff') format('woff'), url('/lib/fonts/NotoSans-Regular-webfont.ttf') format('truetype'), url('/lib/fonts/NotoSans-Regular-webfont.svg#noto_sansregular') format('svg'); font-weight:normal; font-style:normal; font-display:swap; } .ui-widget.ui-widget-content{border:1px solid #aaa} .ui-widget-content{background-color:#EEEEEE !important; background-image:none !important;} #foldingtypes{display:flex;justify-content:space-around;justify-content:space-evenly;align-items:flex-start;margin-top:20px;flex-wrap:wrap} html body #delivAddr.hidden{display:none!important} .doorcolouroutopt{cursor:pointer} body{color:#000; font-size:13px; min-width:360px; font-family:opensansR, Tahoma, Geneva, sans-serif; -webkit-text-size-adjust:100%; background:#EEE url('img/back.png') repeat; background-position:0 -12px; margin:0;} h1{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:22px; color:#16659C; text-align:center; padding:5px 0 10px 0; margin:0; letter-spacing:1px; font-weight:700} h2{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:18px; color:#16659C; text-align:left; padding:0; margin:0 0 5px 0; font-weight:700} h3{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:16px; color:#16659C; padding:0; margin:0 0 5px 0; font-weight:700} h4{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:15px; color:#16659C; font-weight:500; padding-top:14px; padding-bottom:3px; margin:0;} strong{font-family:Verdana; font-size:16px; padding-right:8px; font-weight:700} input.radio{background-color:white; color:black} select{font-size:14px} form{display:inline} p{margin:0; padding-bottom:8px} .spaciousli li{margin-top:4px} select{cursor:pointer} select:disabled{pointer-events:none} video{cursor:pointer;} body > table{width:100%;max-width:1250px;} .s700{visibility:hidden} .ui-dialog-titlebar-close:focus {outline:0} .ui-dialog-title{font-family:opensansR, Tahoma, Geneva, sans-serif !important;} /*table td{max-width:1250px;}*/ /* Header */ .topmenuIcons{background:url('img/icon-menu-index2.png'); width:21px; height:20px; display:inline-block; padding:1px;vertical-align: middle} #topmenu a{margin-right:5px;} .headerRow{text-align:center; margin:0 auto; display:flex; justify-content:space-around; flex-wrap:wrap; align-items:center;box-sizing:border-box; width:100%; max-width:1250px; color:#fff !important;} #header{box-sizing:border-box; width:100%; height:72px; background:#041d3b; background:linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(4,29,58,1) 30%); border-left:1px solid #555; border-right:1px solid #555} .wht-header-hide{display:none} .wht-header{display:block} .tlf-header-hide{display:none; color:#fff !important; -webkit-text-fill-color:rgba(250,250,250,1); -webkit-opacity:1; color:rgba(250,250,250,1);} .cont-header{display:block; color:#fff !important; -webkit-text-fill-color:rgba(250,250,250,1); -webkit-opacity:1; color:rgba(250,250,250,1);} .cart-header{margin-left:0;} .glass-header{display:block} /* pop up */ .popUpSelector{display:flex; justify-content:center; flex-wrap:wrap; align-items:center; font-family:Tahoma, Helvetica, sans-serif; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; user-select:none; padding-top:5px !important} .popUpSelector div{cursor:pointer; position:relative; border:solid 1px lightgray; border-radius:5px; font-size:14px; text-align:center; margin:0 auto;} .popUpSelector > div{margin-bottom:10px !important; margin:0 10px 0 10px; background:#e5f4f7;} .popUpSelector .selected{background-color:#aff2ff; box-shadow:0 0 7px 0 #2d3d59, 0 0 5px 0 #9090FF; border:solid 1px #2d3d59;} .popUpSelector div span{display:block; border-top-left-radius:5px; border-top-right-radius:5px} .popUpSelector p{display:block; padding:2px} .popUpSelector b{vertical-align: middle;} .blindh2, .blindh3{text-align:center;} .tlf-header-hide span, .wht-header-hide span, .cont-header span, .wht-header a span{font-size:16px; vertical-align:middle; line-height:35px; color:#fff !important; -webkit-text-fill-color:rgba(250,250,250,1); -webkit-opacity:1; color:rgba(250,250,250,1);} #search-txt{font-size:16px; color:#fff} /* search bar */ .searchInput{position: relative; padding:5px; width:20px; cursor:pointer; color:#525252; font-size: 16px; font-weight:100; letter-spacing:2px; border:none; border-radius:5px; transition: width 0.4s ease; outline:none; background:url('img/search-icon.png') no-repeat; background-position: 0px 0px; width:21; height:22; background-color:rgba(0,0,0,0); background-color:#041d3b; padding-left:16px; border:4px solid #041d3b;height:32px;} .searchInput:focus{padding:5px; border-radius:5px; width:200px; padding-left:32px; background-position:-22px 0px; background-color:#fff; border:4px solid #fff;} .searchInput:focus{border:none; height:32px; position: relative; font-size: 16px; font-weight:100; padding:5px; border-radius:5px; width:200px; padding-left:32px; background-position:-22px 0px; background-color:#fff; border:4px solid #fff;} .searchButton{min-width:200px} .searchButton span{color:#fff; font-size:16px} /* Cart icon */ .cart-icon{background:url('img/new-cart.png') 0px 0px no-repeat; width:36px; height:30px; margin:0 auto; position:relative;} .cart-icon-full{background:url('img/new-cart.png') -36px 0px no-repeat; width:36px; height:30px; margin:0 auto; position:relative;} .cart-number{text-align:center; color:white; padding-left:5px; font-size:12px; } .cart-number b{width:17px; height:12px; font-size:10px; position:absolute; top:28%; left:38%;} .cart-icon:hover, .cart-icon-full:hover{transform: skew(-10deg);} /* Slide */ #slides {-webkit-user-select:none;} .main-slide{display:flex; flex-direction:row; position:relative; background:linear-gradient(100deg, #2d3d59, #2d3d59 50%, transparent 50%, transparent); max-width:1250px; margin:0 auto; text-align:center;} #slides{position:relative; text-align:left; height:290px; border:none;} #slides ul{list-style:none; padding:0; display:block; -webkit-margin-before:1em; -webkit-margin-after:1em; -webkit-margin-start:0px; -webkit-margin-end:0px;-webkit-padding-start:0px; margin:0px} #slides li{position:absolute; background-size:cover; background-position:center; top:0; left:0; height:100%; opacity:0; pointer-events:none; /*transition:opacity 500ms;*/ width:100%} .mainslide li{width:105% !important; display:flex; justify-content:center; align-items:center; flex-direction:column; padding:0 0 0 2%; height:85%; top:auto !important; left:auto !important;} #slides li.SLIDEvisible{opacity:1; pointer-events:all} #slides .goback,#slides .goforward{position:absolute; color:#FFF; bottom:35%; font-size:32px; user-select:none; cursor:pointer} #slides .goback{left:5px} .slides-design .goback{left:0px !important} #slides .goforward{right:0px;} .slider-text div{padding: 0 0 3px 24px; font-size:16px;font-weight:300; color:#fff !important; margin-bottom:5px; position:relative; padding-left:35px; display:block; -webkit-text-fill-color:rgba(250,250,250,1); -webkit-opacity:1; color:rgba(250,250,250,1); max-width:none;} .slider-text div span{position:absolute; left:0; width:25px; height:25px; background:url('img/headertick.png'); text-align:center; font-size:18px; color:#fff !important; -webkit-text-fill-color:rgba(250,250,250,1); -webkit-opacity:1; color:rgba(250,250,250,1);} .slider-title{font-size:15px;color:white; display:block; position:relative; font-family:opensansR,Tahoma, Geneva, sans-serif; margin-left:40px; margin-bottom:8px; text-align:left;} #slides .goback, #slides .goforward{color:#4dc6e5; z-index:3} .img-banner, .promotion1,.promotion2, .promotion1, .promotion4{max-width:610px; width:100%; padding:0px; max-height:auto; cursor:pointer;} .slidesdiv1{text-align:center; width:47%; height:auto;} .slidesdiv2{text-align:center; width:53%} .slider-hide{display:block;} .mainslide .slider-text{margin:10px; display:block; padding-right:25px;} /* slider designers */ .slides-design{height:260px !important; max-width:1250px; margin: 0 auto; text-align:center;} .slides-design-img{max-width:700px; margin-left: auto; z-index:-1; position:relative; max-height:260px; width:auto;} .slides-design .goback{left:0} .slides-design .slider-text{padding:1% 0 0 1%; display:block; height:auto;} .slides-left{background:linear-gradient(95deg, #2d3d59, #2d3d59 52%, transparent 52%, transparent); display:flex; flex-direction:row; height:260px;} .slides-design .img-banner{z-index:1; text-align:center;} .slides-left-child{height:260px; width:100%; display:flex; justify-content:center; align-items:center; flex-direction:column; padding:0 0 0 2%;} .slide-img-left{width:100%; overflow:hidden;} /* Arrow text box */ .text-box-desktop, .text-box-mobile{position:absolute; background:#d87503; font-size:12px; color:#fff; max-width:100px; border-radius:5px; text-align:center; margin:5px; display:inline-block;} .text-box-desktop:after, .text-box-mobile:after{bottom:100%; left:20%; border:solid transparent; content:""; height:0; width:0; position:absolute; pointer-events:none; border-color:rgba(216,117,3,0);border-bottom-color:#d87503; border-width:5px; margin-left:-5px;} .text-box-mobile{display:none; max-width:80px} .text-box-mobile:after{display:none} /* Buttons */ .confirm-button{margin: 0 20px 0 20px;} .return-trade{text-align:left} .ui-dialog-buttonset button{font-size:18px; height:35px; padding:5px 15px;} .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{ background-image:linear-gradient(0deg, #95b5ce 30%, #d3e5f2 90%); border: 1px solid #989fa5; color:#000; } .ui-controlgroup-disabled .ui-button{background-image:linear-gradient(0deg, #95b5ce 30%, #d3e5f2 90%) !important} .ui-controlgroup-disabled{cursor:not-allowed;} .ui-widget select{background-image:linear-gradient(0deg, #95b5ce 30%, #d3e5f2 90%); border: 1px solid #989fa5; color:#000; border-radius:4px; height:24px;} .toggle-modern .toggle-slide .toggle-on{background:#467496 !important;} .toggle-modern .toggle-slide .toggle-off{background:#95b5ce !important;} .toggle-blob{background-image:linear-gradient(0deg, #95b5ce 50%, #d3e5f2 90%) !important;} .button{font-size:15px; font-family:'opensansR';} .button, .blue-button, .windetails .button, .ui-dialog-buttonset button{color:#fff !important; background-image:linear-gradient(0deg, #016bbf 50%, #45a4f0 90%); border:1px solid #0077cc;border-radius:4px; cursor:pointer; vertical-align:baseline; direction:ltr; font-weight:420; overflow:visible; padding:3px 14px; text-align:center; touch-action: manipulation; white-space: nowrap; box-sizing:border-box; user-select:none; -webkit-user-select:none;} .button:disabled, .blue-button:disabled, .windetails .button:disabled, .ui-dialog-buttonset button:disabled{cursor:default;opacity:.4;} .button:hover, .blue-button:hover, .windetails .button:hover, .ui-dialog-buttonset button:hover{background-image:linear-gradient(#45a4f0,#016bbf); border-color:#006fbf; text-decoration:none;} .windetails .button{background-image:linear-gradient(0deg, #95b5ce 30%, #d3e5f2 90%); border:1px solid #989fa5; color:#000 !important;} .windetails .button:hover{background-image:linear-gradient(#b1c7d8, #e8eff4); border-color:#888d92;} .windetails .button:active{background-image:linear-gradient(0deg, #016bbf 50%, #45a4f0 90%);} .cart-button{font-weight:bold; height:30px; font-size:15px !important;} #extsummary{width:90px; padding:3px 10px !important;} .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{background:#467496 !important; border:1px solid #989fa5; color:#fff;} .ui-menu .ui-menu-item:hover{} .blue-button{background-image:linear-gradient(0deg, #016bbf 50%, #45a4f0 90%) !important; border:1px solid #0077cc !important;} .ui-dialog .ui-helper-clearfix .ui-dialog-buttonset .ui-button{min-width:70px; background-image:linear-gradient(0deg, #016bbf 50%, #45a4f0 90%) !important; border:1px solid #0077cc !important;border-radius:4px !important; cursor:pointer; font-size:15px !important; font-weight:bold !important; margin:0 20px 0 20px;} .ui-dialog .ui-helper-clearfix .ui-dialog-buttonset .ui-button:hover{background-image:linear-gradient(0deg, #45a4f0 50%, #016bbf 90%) !important;} /* Video play */ .vid-wrapper{position:relative; display:inline-block;} .vid-play-cont{background:rgba(0,0,0,0.2); width:100%; height:99%; position:absolute; top:0; left:0;} .vid-cont{position:absolute; display:inline-block; transform:translate(-50%,-50%); top:50%; left:50%; color:#FFF; width:100%; text-align:center; z-index:1; font-size:15px;} .vid-play{font-size:40px !important; cursor:pointer; display:inline-block; text-align:center; color:#333; background:rgba(255,255,255,0.8); border-radius:100%; height:60px; width:60px; padding:5px 0 0 8px;} .vid-cont div:nth-child(2){text-align:center; max-width:230px; background:rgba(0,0,0,0.5); margin:0 auto; width:100%; border-radius:5px} .vid-play:hover{transform:scale(1.1);} .blue-div{background:rgba(195,223,239,0.2); padding:10px; margin-bottom:5px; border:0px} /* social icons */ .social-icons{background:url('img/footer-icons.png'); width:40px; height:40px; display: inline-block; vertical-align:middle; padding-right:5px; cursor:pointer;} .facebook{background-position:-4px -5px} .instagram{background-position:-60px -5px;} .twitter{background-position:-116px -5px;} .whatsapp{background-position:-220px -5px;} .whatsapp-small{background-position:-265px 0px;width:20px;height:23px;} .phone{background-position:-194px 0; width:23px; height:25px;} .envelop{background-position:-165px 0; width:26px; height:25px;} .social-icons-conct{background:url('img/con-icons.png'); width:35px; height:40px; display: inline-block; vertical-align:middle; padding-right:5px; cursor:pointer;} .con-whatsapp{background-position:0px -5px;} .problem-report{background-position:-41px -5px;} .phone-big{background-position:-81px -5px;} .email-envelop{background-position:-121px -5px;} .social-icons:hover, .social-icons-conct{transform:scale(1.05); animation-name:fspin; animation-duration:800ms;} @keyframes fspin{from {transform:rotate(0deg);} to{transform:rotate(360deg);}} /* footer */ .bcheck{color:#197932;border:1px solid #3db382;border-radius:10px; font-size:11px; margin-top:2px; height:15px; display:flex !important; max-width:95px; margin:0 auto;} .bcheck span{background:url('img/reviewtick.png'); height:15px; width:15px; margin-left:-3px; display:inline-block;} .fContainerTable{/*background: linear-gradient(transparent 0px, transparent 70px,#041d3b 70px);*/background: linear-gradient(transparent 70px, rgb(119, 132, 148) 100px, rgb(40, 62, 87) 125px, #041d3b 140px)} .fContainer{margin:0 auto; min-height:400px; border-top:60px; font-family:opensansR,Tahoma, Geneva, sans-serif;max-width: 1250px; -webkit-user-select:none;} .ftopRow, .ftopRow2, .ftopRow3, .ftopRow4{text-align:center; margin:0 auto;display:flex; justify-content:space-around; flex-wrap:wrap;} .ftopRow div{cursor:pointer; width:180px; height:125px; margin:10px auto; border:1px solid #aaa; -webkit-box-shadow: 0px 0px 14px -6px rgba(0,0,0,0.83); box-shadow:0px 0px 14px -6px rgba(0,0,0,0.83); background:#f1f1f1;} .ftopRow b{color:#03276f} .ftopRow2 div, .ftopRow4 div{color:#fcfcfc; margin:10px auto; background:transparent; padding:0 5px 0 5px;} .ftopRow2 div{text-align:left;} .ftopRow2 div a, .ftopRow3 a{color: #fcfcfc; text-decoration:none; cursor:pointer;} .ftopRow div:hover {transform: scale(1.05);} .ftopRow3{background-color:#042d49; color:#ffff; font-size:16px; padding:10px; font-family:Arial;} .ftopRow3 a{padding:10px} .ftopRow3 div b{font-weight:normal !important; padding:5px; font-size:16px} .ftopRow2 p a:hover, .ftopRow3 a:hover{color:#f0da1f !important;} .full_banner{max-width:703px; width:100%; margin:0 auto; height:auto; display:block;} /* reviews */ .reviewsRowDiv{cursor:pointer; width:220px; height:180px; font-size:12px !important; background:#fcfcfc; margin:0 10px 0 10px; text-align:center; vertical-align:middle;} .reviewsRowDiv a div p{font-size:12px !important;} .review-title{color:#000; font-size:18px; text-align:center;} .testimonials a:hover{color:#000 !important;} .testimonials .maingalcontainer .maingal{max-width:1200px !important; -webkit-user-select:none;} .reviewsRowDiv p{padding:0 2px 8px 2px; word-break:break-word !important;} .stars{font-size:25px;color:#dfaa00 !important;text-decoration:none;} .reviewsRowDiv a div p{white-space:normal;height:78px;} .reviewsRowDiv a div b{color:#727272} .reviewName{color:#000 !important} .reviewImg{width:auto !important; height:70px !important; padding:0px !important; margin:0 auto !important; border:solid thin #505050; border-radius:4px; max-width:100px !important;} .reviewAuthor{position:absolute !important; bottom:5px; left:0px; width:100%} .reviewImgDiv{display:flex !important; flex-direction:row} .zoomReview{width:18px; height:24px; position:absolute; bottom:2px; right:2px; background-image:url('img/zoom.png');} /* partners */ .partners{text-align:center; margin:10px auto 10px auto; display:flex; justify-content:space-around; flex-wrap:wrap; max-width:800px;} .partners div{background-image:url('img/partners.png'); height:50px; margin:10px 5px 10px 5px;} .partners div:nth-child(1){width:95px; background-position:0px -1px; cursor:pointer;} .partners div:nth-child(2){width:68px; background-position:-96px -1px; cursor:pointer} .partners div:nth-child(3){width:69px; background-position:-164px -1px} .partners div:nth-child(4){width:169px; background-position:-242px -1px} .partners div:nth-child(5){width:50px; background-position:-420px -1px; cursor:pointer} .newsRow{text-align:center; margin:0 auto; display:flex; justify-content:space-around; flex-wrap:wrap; width:96%;} .newsRow div{cursor:pointer; margin:10px 0; -webkit-box-shadow:0px 0px 6px 0px rgba(0,0,0,0.41); box-shadow:0px 0px 6px 0px rgba(0,0,0,0.41); background:#fcfcfc; position:relative;} .news-title{color:#000; font-size:18px; font-weight:bold; text-align:center;} .news-img{height:120px; width:100%; background-size:cover !important; padding:0px; margin:0; margin-bottom:3px; display: inline-block;} /*#infoArticles div button{position:absolute; margin-left:-40px; left:50%; bottom:5px}*/ #infoArticles > div > div{width:220px; height:195px; background:#fcfcfc; white-space:normal; vertical-align:middle; margin:0 10px 0 10px; text-align:center;} .news-more{color:#1561ad; display:block; font-size:14px; cursor:pointer;} .news-more b{font-size:18px} .news-more:hover{font-weight:bold;} /* Measurement page */ .measurement-row, .measurement-row-bay{text-align:center; margin:0 auto;display:flex; flex-wrap:wrap; justify-content:center; margin-bottom:15px;} .measurement-div{background:rgba(195,223,239,0.2); max-width:600px; padding:5px; font-size:14px; margin:10px 20px 0 20px; position:relative; flex:1; margin-bottom:10px;} .measurement-row div span, .measurement-row-bay div span{position:absolute; left:-18px; top: calc(50% - 25px); font-size:35px; color:#fff; font-weight:bold; background:#388fd3; height:50px; width:50px; border-radius:50%;} .measurement-row-bay{flex-direction:column !important} .measurement-row-bay div span{font-size:25px !important; height:35px !important; width:35px !important;} .measurement-bay{max-width:800px; padding-left:20px;} .measurement-row-div{padding:10px} .measurement-row-div img{height:224px; width:150px} .measurement-row-div .winimg{height:197px; width:200px} .measurement-row-div .oddwinimg{height:157px; width:200px} .measurement-row-div .swinimg{height:231px; width:230px} .measurement-row-div{display:inline-block; max-width:285px; vertical-align:middle;;} .note-box{position:relative; background:#e7eff3; font-size:13px; color:#000; max-width:900px; border-radius:5px; text-align:center; margin:5px; margin:0 auto; padding:10px} .note-box:after{bottom:100%; left:50%; border:solid transparent; content:""; height:0; width:0; position:absolute; pointer-events:none; border-color:rgba(231,239,243,0);border-bottom-color:#e7eff3; border-width:15px; margin-left:-15px;} .text-points{background:rgba(195,223,239,0.2); margin:0 auto; padding:10px; max-width:900px; font-size:14px} .text-points .points-title{font-size:16px; color:#1561ad} .text-points div{text-align:left;} .text-points ul{padding-left:22px;} .desin-text{max-width:1250px !important;} /* brochures */ .row-brochures{text-align:center; margin:0 auto;display:flex; flex-wrap:wrap; justify-content:center; margin-bottom:15px; flex-direction:column;} .div-brochures{background:rgba(195,223,239,0.2); max-width:1250px; padding:5px; font-size:14px; margin:10px 10px 0 10px; position:relative; margin-bottom:10px; display:flex;} .row-div-brochures{display:inline-block; vertical-align:middle;} .div-brochures .row-div-brochures:nth-child(1){width:110px; text-align:right;} .div-brochures .row-div-brochures:nth-child(2){max-width:900px; text-align:left; padding-left:5%;} .happytohelp{display:block} .main,.main3{padding:10px 10px 10px 10px; margin-top:10px; max-width:1250px; margin:0 auto; text-align:center;} .main2{padding:10px 10px 10px 10px; max-height:660px; overflow:auto} .main,.main2,.mainb,.main3{text-align:left; background-color:#FCFCFC;} .main3{font-size:12px} #triple a:hover{opacity:0.85; color:black} #triple h2{text-align:center} #backingoptions{text-align:center} .toprated{display:inline} .priceg{width:81px; height:65px; border:none; cursor:pointer; position:absolute; right:23px; bottom:14px; z-index:2} .optimag{height:74px;width:74px; border:none; cursor:pointer; position:absolute; right:122px; bottom:9px; z-index:2;background:url('img/heritage.png')} .tickt1,.tickt2,.tickt3{user-select:none;height:78px;margin-top:168px; width:100%; background-color:black;background: linear-gradient(transparent 0px, transparent 10px,rgba(0,0,0,0.7) 10px); padding:17px 7px 7px 27px} .tickt1 h4, .tickt2 h4, .tickt3 h4{width:50%; font-family:opensansR,Tahoma, Geneva, sans-serif; font-size:17px; color:white; font-weight:300; padding:0 0 3px 24px; margin:0} .tickt1 h4{background:url('img/tick1.png') left no-repeat} .tickt2 h4{background:url('img/tick2.png') left no-repeat} .tickt3 h4{background:url('img/tick3.png') left no-repeat} .salesbanner{max-width:800px; display:flex; margin:0 auto; background-color:black;background-color:rgba(0,0,0,0.7)} .salesbanner img{width:100%; height:auto; margin:0 auto; display:flex; content:url('/img/home/fastdel-banner.png')} @keyframes flash-icon {0% {opacity:1;} 70% {opacity: 0.5;} 100% {opacity: 1;}} .mobilehide{display:initial} @media(max-width:750px){.salesbanner img{content:url('/img/home/fastdel-banner-mobile.png'); max-width:400px !important} .mobilehide{display:none} } #meassheet input{width:64px; border:2px solid #c3c9cc; border-radius:0px;} .steps{position:relative; top:-90px; left:550px; background-color:rgba(0,0,0,0.6); padding:8px; width:230px; font-family:'opensansR'; font-size:16px; color:white} #cylinder {padding-bottom:10px} .fancytext,.largetext,.backtext{overflow:hidden; font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:15px; padding:0 2px 0 2px} .largetext{font-size:18px; line-height:180%} .backtext{font-size:14px} #previewpic{margin:2px} #preview{clear:both; padding-top:10px} #preview input{background-color:white;color:black} #bottomtxtContainer{position:relative;min-height:83px;padding-top:13px} #bottomtxt {font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:13px; text-align:center;width:100%} #bottomtxt >span {vertical-align:middle} .chooseown {width:100%!important; position:relative!important; background:radial-gradient(rgba(249,255,134,0.5) 0%, rgba(255,255,255,0) 100%); font-weight:bold!important; font-family:"Comic Sans MS",Verdana!important; font-size:26px!important; color:red} .chooseown button{font-size:20px; margin:8px 0 12px 0} #horwidth {text-align:center} #horwidth button{font-size:12px; padding:0 4px; margin:0 0 1px 4px} .largefonttd td{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:16px} #sheeticon img{cursor:pointer; margin-right:15px; vertical-align:middle; padding-top:3px;} #sheeticon:hover img{transform:scale(0.95);} #sheeticon:hover{color:#B00000; cursor:pointer} .ui-controlgroup {margin-right:7px} .centerimg{padding:0; margin:0; text-align:center} .glazingdiv{text-align:center} .glazingdiv img{width:114px; cursor:pointer; margin:4px} #glazing h3{text-align:center; font-size:15px; margin-bottom:2px} #glazing {width:146px} .btnpas24{position:absolute;top:0;cursor:pointer;left:35px;} .inviewbtn{position:absolute;right:4px;top:0} .animbtn{position:absolute;left:4px; top:0} .inviewbtn div, .animbtn div{width:54px; height:54px; margin:0 auto; background:url('img/inview.png') left; margin-bottom:2px; cursor:pointer} .inviewbtn div:hover, .animbtn div:hover, .baybtn img:hover{box-shadow:0 0 11px rgba(33,33,33,.2)} .animbtn{float:left; margin:9px 2px 2px 4px} .animbtn div{background:url('img/inview.png') -54px 0 no-repeat} .iconlist{float:right; margin-right:0; margin-top:9px; margin-bottom:10px; padding-bottom:6px; background-color:#F4F4F4; border:1px black solid; border-radius:8px; width:132px} .iconlist img{border-top-right-radius:5px; border-top-left-radius:5px} .iconlist div{width:120px; height:117px; border:1px #404040 solid; border-radius:6px; margin-bottom:13px; background-color:#FEFEFE;font-size:12px; font-family:Arial; text-align:center; overflow:hidden} #footer{padding-top:10px; margin-right:9px; text-align:center; font-size:13px; font-family:'opensansR'; color:#333; line-height:140%; -webkit-text-size-adjust:100%} #footer a:hover{text-decoration:underline} .ttext span{color:black; text-decoration:none; font:bold 15px Arial Narrow; cursor:pointer} .ttext:hover span{color:yellow; text-decoration:none; font:bold 15px Arial Narrow; cursor:pointer} .headtext{font-family:'opensansR'; font-size:15px; text-align:center;} .list{margin:0; padding:0; margin-left:20px; margin-bottom:2px} ul.mlist{font:italic 15px Verdana; text-align:left; margin-top:0; margin-bottom:0} ul#hlist,#compwin ol{font:13px Arial; padding:0; margin:0 30px 10px 30px} .cartbuttons > a {padding:0 5px} #carttab{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:14px} #carttab i{font-size:13px; font-style:normal} .cartimg{width:80px; border:none} .zoomicon{width:18px; height:24px; margin-left:-18px; border:none} .carticons span{display:inline-block; width:18px; height:18px; margin-right:4px; background:url('img/carticons.png'); cursor:pointer} .carticons span:hover{opacity:0.7} #min_cart td{font-size:13px; font-family:opensansR, Tahoma, Geneva, sans-serif; background-color:#dae8ef; border-bottom:1px #A0A0A0 dotted} .centertd td{text-align:center} #undecided{font-family:opensansR, Tahoma, sans-serif; font-size:14px; color:#777; text-align:center; padding-top:6px} #undecided a{color:#777} #undecided a:hover{color:#900} .free{font-family:Roboto, Verdana, Geneva, sans-serif; font-size:17px; color:#16659c; margin:0 10px 5px 0; font-weight:bold;} .free2{font-family:Roboto, Verdana, Geneva, sans-serif; font-size:16px; color:#16659c; margin:1px; font-weight:bold;} .important{font-size:18px; color:#C00; text-shadow:0 0 6px #F88; text-align:center; margin-bottom:6px} #discounttxt{font-style:italic; color:#505050} #spendmore{float:right; color:#000080} .readmore{padding-left:8px; color:#00F; font-style:italic; cursor:pointer; text-decoration:underline} #vaotha{z-index:1} #vvoth{z-index:2;position:relative} #contacttab input, #contacttab textarea, #contacttab2 input, #contacttab2 textarea{width:300px; font-size:15px; font-family:opensansR, Tahoma, Geneva, sans-serif} #contacttab td, #contacttab2 td{vertical-align:top; font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:16px} #contacttab .icn{width:42px; height:40px; background:url("img/contact-icons.png?1") no-repeat} #contacttab2{margin:-4px 0 0 -4px} #contacttab input[type=text], #contacttab2 textarea{background:#E8E8E8} #contacttab2 td{font-size:14px} span.avoidwrap{display:inline-block} .ordertab input[type=text], .ordertab textarea, .ordertab select{font-size:14px; font-family:opensansR, Tahoma, Geneva, sans-serif; background:#EEEEEE} .ordertab input[type=text]{width:300px} .ordertab td, .ordertab th{font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:14px} .ordertab th{font-weight:300; text-align:right; padding-right:4px} #delivAddr {position:absolute; top:90px; left:560px} #deloption {position:absolute; top:65px; left:560px} #delivAddr th {display:none} .smaller td{font-family:'opensansR'; font-size:13px} .bigfont td{font-family:'opensansR'; font-size:16px; padding-bottom:20px} .headl li{text-align:left; font-size:12px} .headl h1{font-size:16px; font-family:'opensansR'} .headl h2{font-size:14px} div.headl{cursor:pointer; padding:0; font-size:8px; font-family:Arial-Narrow; display:none; width:100%; height:6px} table#plist td{font-family:Times New Roman; font-size:14px; color:#000; text-align:center; width:128px} .fimg2{border:1px #444 solid; border-radius:4px} a:hover .fimg, a:hover .fimg2{opacity:0.85} .timg img{border:outset thin white ; margin-top:12px; margin-bottom:12px} .imgw{border:solid thin #505050; border-radius:4px} .infothumb{margin:0 0 0 20px} .imgthin img{border:outset thin white} .imgr{border:outset thin #505050; border-radius:4px} .padded{font-family:'opensansR'; padding-left:10px; padding-right:10px} .justpad{text-align:justify; padding-right:8px} #submit{text-align:center; font-size:13px} .red a:hover{color:red} #carttop{font-size:14px; font-family:'opensansR'; color:#F4F4F4} .hh{text-align:left; font-size:16px; font-weight:bold; display:none} #topmenu{clear:both;overflow:hidden; margin:0 auto; max-width: 1250px;} #topmenu td{border-top:1px solid #555; text-align:center; padding:5px 0 5px 0; text-align:center; font-weight:300; font-size:15px; font-family:'opensansR'; cursor:pointer; background:#042d49;} #topmenu td a{color:#fff !important;} #topmenu td:hover{background:#1561ad; color:#FFF!important} #topmenu th{max-width:1px; width:1px; min-width:1px; background-color:#000} #topmenu a:hover{color:#DDD} #topmenu b{font-weight:700; color:#000060} .mobiledesigner .ui-controlgroup .ui-checkboxradio-radio-label{padding:3px 2px !important} .mobiledesigner .ui-controlgroup.ui-controlgroup-horizontal{margin-right:0} #contactlist button{background-image:linear-gradient(#41a0eb,#0270c8); border:1px solid #0076cb; border-radius:4px; box-sizing:border-box; color:#FFFFFF; cursor:pointer; font-family:Arial,sans-serif; font-size:17px; font-weight:400; line-height:1.3; min-width:30px; overflow:visible; padding:2px 8px; text-align:center; white-space:nowrap;} #contactlist button:hover{background-image:linear-gradient(#51a8ec,#1479ca); border-color:#1680cc; text-decoration:none;} .noselect, .button, .toggle-slide, .ui-checkboxradio-radio-label, button{-moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none} #glassdesignsummary{text-align:center} .formnum{margin:0; background-color:transparent; font-weight:700; border:none; outline:none; width:69px; font-family:'opensansR'; font-size:15px; padding:0} .cartnum{margin:0; background-color:transparent; font-weight:700; border:none; outline:none; width:16px; padding:0; margin-top:-3px} #terms{padding-right:5px; overflow:auto; font-family:'opensansR'; font-size:13px; text-align:justify} #terms h4{font-family:'opensansR'; font-weight:700; padding:8px 0 3px 0; margin:0; color:#333333} #terms ul{margin:0 0 5px 0} #terms p{margin:0; padding:0 0 6px 0} #terms td{vertical-align:top; text-align:left} #ourwindows{height:auto; width:auto; overflow:auto; font-family:'opensansR'; font-size:14px; text-align:justify} #ourwindows h3{font-family:'opensansR'; font-size:15px; margin:3px 0 0 0} #tests{height:350px; width:100%; overflow:auto; font-family:'opensansR'; font-size:14px} #tests li{list-style:none; margin:0; padding:0 0 10px 0} .headshadow{text-shadow:0 0 3px rgba(120,200,255,1)} .info{width:16px; height:16px; vertical-align:middle; border:none; cursor:pointer} #imgtab >div { width:268px} .ahome{margin-left:900px; position:absolute; top:4px; border:medium outset blue} .afooter{padding-top:8px; text-align:right} #amain{background-color:#E0E0FF; border:1px solid #003; border-top:none; border-bottom-left-radius:6px; border-bottom-right-radius:6px} .button2{width:160px; font-size:15px; font-family:Verdana; margin:10px; padding:3px; cursor:pointer; border:1px outset purple; text-align:center; cursor:pointer; background:#ccf6f6; border-radius:8px} .button2:hover{border:1px outset yellow; FILTER:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#8080FF,endColorStr=#3030FF); color:yellow; opacity:0.80} .button3,.mouse{cursor:pointer} #tablehead{cursor:default} #tablehead td{text-align:center; border-bottom:1px solid #444} #tablehead2{border:1px solid #CCC; border-radius:3px} #tablehead2 td:nth-child(2){text-align:center} #mainheadline{font-size:18px; text-align:center; font-family:opensansR, Tahoma, Geneva, sans-serif; background-color:#2d3d59;padding-bottom:3px; color:#fff;} .redhead{color:#FF0000; text-shadow:0 0 4px rgba(255,192,0,1)} .redContainer{left:-2px;text-align:center;position:absolute;width:100%;height:100%;top:0;max-width:100%;z-index:9999} .redContainer > div{max-width:100%;width:780px;height:280px;text-align:center;display:inline-block;background-image:url(/img/home/red-overlay.png);background-size:contain;background-repeat:no-repeat;background-position:center} .redContainer2 > div{position:relative;top:-315px;background-image:url("/img/home/red-overlay2-top.png");background-position:bottom} .redContainer2::after{content:'';border:8px solid red;position:absolute;left:0;right:-3px;bottom:-33px;box-sizing:border-box;border-radius:24%;top:-37px} #hometext{font-size:20px; margin:0 0 30px 0; text-shadow:1px 1px 2px rgba(100,100,150,0.9); text-align:center} .scaleclass{-webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1)} .latestnews{font-size:15px; min-height:21px; text-align:center; font-family:opensansR, Tahoma, Geneva, sans-serif; background-color:#D0D0D0; padding-top:2px; color:#000060; border-bottom-left-radius:6px; border-bottom-right-radius:6px} .bld{display:flex;font-family:Helvetica,Arial,sans-serif,arial !important;flex-flow:inherit} .paid{background-color:#B3DEFF} .processed{background-color:#F8F8F8} .refunded{background-color:#FFFF66} .unpaid{background-color:#FF8080} .unknown{background-color:#A00000} .ui-widget {font-family:Trebuchet MS,Helvetica,Arial,sans-serif,arial !important} #alertPopup {font-family:opensansR, Tahoma, Geneva, sans-serif !important} .vrighttext, .vrighttext2{font-family:Arial, Helvetica, sans-serif; font-size:14px; display:inline-block; width:14px; white-space:nowrap; height:100px; -webkit-transform:translate(1.1em,0) rotate(90deg); -moz-transform:translate(1.1em,0) rotate(90deg); -o-transform:translate(1.1em,0) rotate(90deg); transform:translate(1.1em,0) rotate(90deg); -webkit-transform-origin:0 0; -moz-transform-origin:0 0; -o-transform-origin:0 0; transform-origin:0 0} .vrighttext2 {position:absolute; font-size:16px} .arrow{width:10px; height:10px} .vertical input{width:35px; font-size:13px; font-family:'opensansR'; margin-right:1px} .vertical,.horizontal{font-size:14px; font-family:Arial, Helvetica, sans-serif} .horizontal input{width:40px; font-size:14px; font-family:'opensansR'; margin:2px 0} div .valign{min-height:20px; display:table-cell; vertical-align:middle} #cill30mmL{position:absolute; margin:-5px 0 0 -33px; width:45px; height:19px; background:url("/img/cill30mmleft.png") no-repeat;z-index:2} #cill30mmL.min{background:url("/img/cill30mmleftmin.png") no-repeat} #cill30mmR,#cill25mmR,#cill16mmR{position:absolute; margin:-7px 0 0 -4px; width:45px; height:19px; background:url("/img/cill30mmright.png") no-repeat} #cill30mmR.min{background:url("/img/cill30mmrightmin.png") no-repeat} #cill25mmR{background:url("/img/cill25mmright.png")} #cill25mmR.min{background:url("/img/cill25mmrightmin.png") no-repeat} #cill16mmR{background:url("/img/cill16mmright.png")} #cill16mmR.min{background:url("/img/cill16mmrightmin.png") no-repeat} #topvent50,#topvent42,#topvent40{position:absolute; margin:-6px 0 0 0; width:45px; height:31px; background:url("/img/sliding/tricklevent50.png") no-repeat} #topvent42{background:url("/img/bifold/tricklevent42.png")} #topvent40 {background:url("/img/sliding/tricklevent40.png")} #winprice{padding:10px 0 5px 15px; font-size:15px} #extenders .ui-checkboxradio-radio-label, #knocker .ui-checkboxradio-radio-label{padding:3px 4px!important} .bottomtxtsidebyside{display: flex;align-content: center;justify-content: space-around;align-items: center;} .slidingtypespreview > dd{float: none; display: inline-block; margin: 10px 0; height: 120px; text-align: left!important} #doorsprite, #Handleinsprite, #lockinsprite, #doorinsprite, #coloursfImgSelected, #solidDoorinsprite, #solidDooroutsprite, #fcin, #fcout{border: 1px solid grey !important; border-radius:100% !important; width:23px !important; height:23px !important; display:inline-block;} #Handleinsprite{background:url('img/colours.png') no-repeat;} #handleSelector{height:29px !important} .picon,.oicon{position:absolute; width:17px; height:27px; background:url('img/icons.png') no-repeat; cursor:pointer} .oicon{background-position:-17px 0} .ticon{position:absolute; width:21px; height:21px; background:none} /*url('img/icons.png') no-repeat; */ html body .background-FCFCFC-important{background-color:#FCFCFC !important} .windetails{width:220px; margin:0; padding:1px 0 3px 0; text-align:center; font-family:'opensansR'; font-size:14px; overflow:hidden; } .windetails h2{text-align:center} .windetails td{text-align:left} .windetails th{text-align:right; font-weight:300; padding-right:4px} #coloursh,#coloursf,#coloursd{padding-right:1px; text-align:center; margin-bottom:10px} #coloursh li,#coloursf li{list-style:none; display:inline-block; margin:2px 3px; width:32px; height:24px; background:url('img/colours.png') no-repeat; cursor:pointer; border:1px solid #707070; border-radius:4px; font-size:0} .chosencolour, #selectbox img:hover{box-shadow:0 0 7px 0 #0000FF, 0 0 5px 0 #9090FF; box-shadow:0 0 7px 0 #0000FF, 0 0 5px 0 #9090FF; box-shadow:0 0 7px 0 #0000FF, 0 0 5px 0 #9090FF} #selectbox{display:flex;text-align:center;justify-content:space-around;align-items:center;flex-wrap:wrap} .extras #selectbox > div {min-width:320px} #frcolour{padding-bottom:6px} #fitkitdiv,#doornumdiv,#securechaindiv,#restrdiv,#doorextdiv,#pas24div{clear:both; padding-top:10px} .yesnodiv{float:left; padding-top:3px; min-width:120px; text-align:right} #doorextdiv .yesnodiv{min-width:122px} #fitkit, #securechain,#restrictor, #pas24{float:left} .glasslist{overflow:auto; padding:0!important; width:215px; border-top:1px solid #C0C0C0; text-align:center} .glasslist img{width:198px; height:132px; border:none} .glasslist h4{padding:0; margin:-1px auto 9px auto; background-color:#CCC; width:70%; color:black; border-bottom-left-radius:6px; border-bottom-right-radius:6px; font-size:12px; font-family:'opensansR'; text-align:center} /* video-page */ .vid{background:black;width:505px;cursor:pointer} .vidbutton{text-align:center;display:block} .vidtext{text-align:center;font-size:15px;margin-top:-7px;} .imgvid{max-width:150px;border-radius:5px;position:absolute;width:100%;top:0;left:0;z-index:1;} .vidover{position:absolute;top:0;left:0;z-index:2;opacity:0.5;} .vidover:hover{transform:scale(1.1);opacity:1;} .vidthumb {cursor:pointer; max-width:180px; margin-bottom:10px; height:170px} .vidthumbimg {position:relative; width:150px; height:120px; padding:5px; margin:0 auto;} /* info pages */ .infoHeadline{background: rgb(252,252,252); background: linear-gradient(180deg, rgb(252, 252, 252) 80%, transparent 100%); border-radius: 5px; padding:10px; margin:10px; margin-bottom:0px;} .infoHeadline h1{padding:0px !important; margin-bottom:4px;} .mainInfo{max-width:1250px; margin:0 auto; position:relative; display:flex; flex-wrap:wrap; flex-direction:row;} .mainInfo p{font-size:14px; text-align:justify;} .infopart{flex:1; background-color:#fcfcfc; border-radius:5px; padding:10px; margin:10px; position:relative;} .decoImg{background: url(img/home/slide-win1.jpg) no-repeat; clip-path:polygon(100% 0%, 100% 100%, 6% 100%); display:block; height:200px; width:100%; position:absolute; bottom:0px; right:0px; border-radius:5px;} .ecerti{width:200px;height:200px} .recerti{width:300px;height:200px} .mainInfo h3{font-size:18px} .infxp{min-height:180px; max-width:76%; text-align:left !important;} .subtitle{text-align:center; font-size:14px} .imgFloat{position:relative; float:right; text-align:center; margin:0 auto; padding-left:12px;} .imgFloat img{cursor:pointer;} .imgFloat span{position:absolute; bottom:6px; right:4px; background:url(img/zoom.png) 0px 0px; width:18px; height:24px;} .whiteFloat span{background:url(img/zoom1.png) 0px 0px; width:22px; height:28px} .infimg290{width:290px; height:200px} .more-reading{position:relative; background:#fcfcfc; font-size:13px; color:#000; max-width:900px; border-radius:5px; text-align:center; margin:5px; margin:0 auto; padding:10px; max-width:400px} .more-reading:after{bottom:100%; left:50%; border:solid transparent; content:""; height:0; width:0; position:absolute; pointer-events:none; border-color:rgba(252,252,252,0);border-bottom-color:#fcfcfc; border-width:15px; margin-left:-15px;} .img350{margin:0 auto;text-align:center;float:none !important;max-width:350px;} .img350 img{max-width:350px;width:100%;height:auto;} #faq div{cursor:pointer; padding-left:20px; margin-top:8px; font-family:opensansR, Tahoma, Geneva, sans-serif; background:url('img/arrow.png') top left no-repeat} #faq div:hover{background:url('img/arrow3.png') top left no-repeat} #faq dl{padding:0;transition:max-height 0.15s ease-out;max-height:0;overflow:hidden;margin:0;padding:0} #reply{position:absolute; visibility:hidden; max-width:420px; font-family:opensansR, Tahoma, Geneva, sans-serif} #arrow{position:absolute; visibility:hidden; padding-left:2px} .hr{height:3px; clear:both; font-size:1px; line-height:1px} #whylinks{padding:2px 0 4px 0; font-size:13px} #whylinks0{padding-top:1px; font-size:13px} #whylinks span, #whylinks0 span{cursor:pointer} .ivat{font-style:italic; color:#555; padding:1px 0 7px 0} #specbtn{margin:5px} #sizewin{min-height: 500px!important} #SP-slider-container {background:#dcdcff;cursor:pointer;} #SP-slider-container {height: 14px!important;border:1px solid black!important} #SP-slider {position: relative;top: 2px;background:none!important} #noscript{position:absolute; top:130px; background:white; border:double 5px red; padding:15px; margin-left:170px; font-size:20px; text-align:center; line-height:300%} #ttpictures{text-align:center; width:200px; height:260px; overflow:hidden} #ttpictures a{width:200px; height:260px; display:block} /* doors */ #doorfamilies,#doormembers{display:flex;flex-wrap:wrap;} #doormembers{justify-content:space-evenly} #doorfamilies{margin-left:4px;} #doorfamilies a{display:block; width:81px; margin:10px 0 10px 0; text-align:center; font-size:14px; font-family:"Arial Narrow",sans-serif-condensed; font-stretch:condensed} #doorfamilies img{width:60px; height:140px; margin:2px 10px 1px 10px; border:none; -webkit-transition-duration:0.1s; transition-duration:0.1s; -webkit-transition-property:-webkit-transform; transition-property:transform} .cdoortip{display:block; width:120px; height:270px; background:url('img/SC/doorsprite.jpg') } #doormembers a{display:block; width:68px; margin:8px 0 12px 0 ; text-align:center; font-size:13px; font-family:"Arial Narrow",sans-serif-condensed; font-stretch:condensed; -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-property:-webkit-transform; transition-property:transform} #doormembers img{border:none; margin:2px 10px 2px 10px; border:none} .doormembersahover{background:white; -webkit-transform:scale(2); -ms-transform:scale(2); transform:scale(2); z-index:40000} #doorframes {display:flex;flex-wrap:wrap;padding:10px 0 0 0} #doorframes > div {flex:1 0 13%;cursor:pointer;height:180px} #doorframes > div > div {position:relative;top:50%;transform:translateY(-50%)} #doorframes span{display:block;height:36px} #doorframes span.mobileLabel{visibility:hidden} #doorframes > div:hover .label {color: #B00000} #doorframes > div:hover .frameimg:after { content: ''; background:black; width:100%; height:100%; display:block; top:0; position:absolute; opacity:0.1; } .frameimgSC {display:inline-block;position:relative;background-image:url('img/SC/frametypes.png')} .frameimg {display:inline-block;position:relative;background-image:url('img/door-frame-types-sprites.png')} .frameimg0 {width:61px; height:113px;background-position:0 0} .frameimg1 {width:82px; height:113px;background-position: -203px 0} .frameimg2 {width:82px; height:113px;background-position: -285px 0} .frameimg3 {width:103px; height:114px;background-position: -1309px 0} .frameimg4 {width:82px; height:113px;background-position: -367px 0} .frameimg5 {width:82px; height:113px;background-position: -449px 0} .frameimg6 {width:103px; height:114px;background-position: -1412px 0} .frameimg7 {width:61px; height:137px;background-position: -61px 0} .frameimg8 {width:82px; height:137px;background-position: -531px 0} .frameimg9 {width:81px; height:137px;background-position: -122px 0} .frameimg10 {width:103px; height:137px;background-position: -1515px 0} .frameimg11 {width:82px; height:137px;background-position: -613px 0} .frameimg12 {width:82px; height:137px;background-position: -695px 0} .frameimg13 {width:103px; height:137px;background-position: -1618px 0} .frameimg14 {width:82px; height:117px;background-position: -777px 0} .frameimg15 {width:82px; height:113px;background-position: -859px 0} .frameimg16 {width:102px; height:113px;background-position: -1105px 0} .frameimg17 {width:103px; height:114px;background-position: -1721px 0} .frameimg18 {width:103px; height:114px;background-position: -1824px 0} .frameimg19 {width:103px; height:114px;background-position: -1927px 0} .frameimg20 {width:103px; height:114px;background-position: -2030px 0} .frameimg21 {width:82px; height:136px;background-position: -941px 0} .frameimg22 {width:82px; height:136px;background-position: -1023px 0} .frameimg23 {width:102px; height:136px;background-position: -1207px 0} .frameimg24 {width:103px; height:137px;background-position: -2133px 0} .frameimg25 {width:103px; height:137px;background-position: -2236px 0} .frameimg26 {width:103px; height:137px;background-position: -2339px 0} .frameimg27 {width:103px; height:137px;background-position: -2442px 0} .frameimg28 {width:61px; height:113px;background-position: -2545px 0} .frameimg29 {width:61px; height:137px;background-position: -2606px 0} /*#doorframes img{position:absolute; width:47px; height:100px; border:none; background-repeat:no-repeat} #doorframes div{position:absolute; background-color:transparent; cursor:pointer} #doorframes div:hover{background-color:#000; opacity:0.1; filter:alpha(opacity=10)} */ #doorwin{width:65px!important; height:65px!important; margin:41px 8px 2px 7px!important} .break{height:0; clear:both} #preview input{z-index:1} /* french doors */ .fdoor-main{display:flex;flex-wrap:wrap; align-items:stretch} .fdoor-main-child1{max-width:1000px;} .fdoor-main-child2{max-width:150px; background:rgba(195,223,239,0.2); margin-left:auto; margin-right:10px;} .french-main-icons{display:flex;flex-wrap:wrap;} .fdoorframes{display:flex;flex-wrap:wrap;padding-top:8px;position:relative} .fdoorframes a{background-color:transparent;cursor:pointer; position:relative;margin:0px 0px 30px 0px;flex:1 0 20%} .fdoorframes > a > span{font-size:12px;position:absolute;bottom: -20px;width:100%;left:0} .fdoorframes.frameTypeMidrail div{background-image:url(img/french/Fframe-types1.png)} .fdoorframes > a > div{background-image:url(img/french/Fframe-types.png);background-repeat:no-repeat;display:inline-block} .fdoor-main-child2 .fdoorframes a{margin:0 15px 30px 15px} .fdoor-main-child2 .fdoorframes #f12{margin-top:-11px;} .fdoorframes #f1,.fdoorframes #f1 div,.fdoorframes #f1 div::after{width:96px;height:113px;background-position:0 0} .fdoorframes #f2,.fdoorframes #f2 div,.fdoorframes #f2 div::after{width:126px;height:113px;background-position:-96px 0} .fdoorframes #f3,.fdoorframes #f3 div,.fdoorframes #f3 div::after{width:127px;height:113px;background-position:-222px 0} .fdoorframes #f4,.fdoorframes #f4 div,.fdoorframes #f4 div::after{width:158px;height:114px;background-position:-349px 0} .fdoorframes #f5,.fdoorframes #f5 div,.fdoorframes #f5 div::after{width:158px;height:114px;background-position:-507px 0} .fdoorframes #f6,.fdoorframes #f6 div,.fdoorframes #f6 div::after{width:96px;height:137px;background-position:-665px 0} .fdoorframes #f7,.fdoorframes #f7 div,.fdoorframes #f7 div::after{width:127px;height:137px;background-position:-761px 0} .fdoorframes #f8,.fdoorframes #f8 div,.fdoorframes #f8 div::after{width:126px;height:137px;background-position:-888px 0} .fdoorframes #f9,.fdoorframes #f9 div,.fdoorframes #f9 div::after{width:158px;height:137px;background-position:-1014px 0} .fdoorframes #f10,.fdoorframes #f10 div,.fdoorframes #f10 div::after{width:96px;height:113px;background-position:-1172px 0} .fdoorframes #f10 div:hover, .fdoorframes #f11 div:hover{} .fdoorframes #f9,.fdoorframes #f11 div,.fdoorframes #f11 div::after{width:96px;height:137px;background-position:-1268px 0} .fdoorframes #f12,.fdoorframes #f12 div,.fdoorframes #f12 div::after{width:116px;height:137px} .fdoorframes a#f12:hover div::after{top:18px;height: 119px!important;} .fdoorframes #f12 div{background-image:url(img/french/alum.png);height:137px;background-position-y: 17px;} .fdoorframes a:hover div::after {content: '';background:black;display:block;top:0;position:absolute;opacity:0.1} .fdoorframes > span {position:absolute;bottom:10px;left:60px} .dottedLabelLine {display:flex;position:absolute;background:none} .dottedLabelLine .halfbar{border:1px dashed black;width:0;display:inline-block;height:9px;position:absolute;top: -1px} .dottedLabelLine .halfbar.right{right:-2px} .dottedLabelLine .spacer{border:1px dashed black;height:0;width:100%;position:absolute;top:8px} .dottedLabelLine .label{background:#fcfcfc;padding:0 8px;z-index:2;left:50%;position:absolute;transform:translateX(-50%)} .hide-french{visibility:hidden; display:block;} /* sliding doors */ .slidingtypesSelectPage .slidingtypes {display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:0 67px;max-width: 1070px; margin:0 auto;} .slidingtypesSelectPage .slidingtypes > div{padding-bottom:10px} .slidingtypesSelectPage .slidingtypes > div > a{float:none;display:inline-block;margin:10px 0} .slidingtypes a{float:left; display:block; height:120px; text-align:left; margin:10px 0 10px 27px} .slidingtypes a:hover{filter:brightness(90%); -webkit-filter:brightness(90%)} .slidingtypes a span{display:block; margin-top:125px; text-align:center; font-size:14px; font-family:"Arial Narrow",sans-serif-condensed; font-stretch:condensed} .slidingtypes img{border:none; margin-top:5px; position:absolute; z-index:10} .slidingtypes .frame2{width:117px; background:url('img/sliding/slidingframes.png?1') 0 0 no-repeat} .slidingtypes .frame3{width:172px; background:url('img/sliding/slidingframes.png?1') -117px 0 no-repeat} .slidingtypes .frame4{width:227px; background:url('img/sliding/slidingframes.png?1') -289px 0 no-repeat} .slidingtypes .frame6{width:332px; background:url('img/sliding/slidingframes.png?1') -516px 0 no-repeat} .guidance .slidingtypes dd{display:block; margin:0 auto; padding:0; height:120px; text-align:left} #slidepreview{display:block; text-align:left; height:120px} .sliderR,.sliderR3{position:absolute; margin-left:-6px; z-index:2!important} .sliderL,.sliderL2,.sliderL3{position:absolute; margin-left:-6px; z-index:2!important} .subheader{display:inline-block; position:relative; top:-2px; font-size:16px; padding-left:30px} .infoendingIcon{display:inline-block;background:url(/img/info.gif) no-repeat;cursor:pointer;width:17px;height:17px;line-height:0;position:relative;top:4px;left:4px} .infoending{display:inline-block;padding-right:20px;background:url(/img/info.gif) no-repeat;background-position:right;cursor:pointer} .pointer{cursor:pointer} .cilldiagram{float:right; width:83px; height:49px; border:0; margin:2px 0 2px 4px} /* folding doors */ .colourblock{display:block; width:100%; height:33px; border:1px solid #999; margin-bottom:12px} /* modal background*/ .ui-widget-overlay{background-color:#000!important; opacity:0.2!important; background-image:none!important} .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text{padding:3px 8px 3px 2em!important} .ui-tooltip{font-size:13px !important; font-family:opensansR,Tahoma,sans-serif !important} .ui-menu .ui-state-active{color:#A00000; font-weight:300} .ui-dialog a{user-select:none; -webkit-user-select:none; outline:0; font-family:Tahoma, Helvetica, sans-serif !important;} #glassmenu,#openmenu,#inview,#extmenu,#cnotewin,#unitsize{display:none} #inview,#zoomview{background:#FCFCFC!important; cursor:pointer;text-align:center} #georgianbars{visibility:hidden} #georgianbars i{font-size:12px} .center{text-align:center} .ui-button-text-only .ui-button-text{padding:3px 5px!important} body .ui-button { padding: 3px 8px 3px 8px; } #slides .goback:hover, #slides .goforward:hover { color: red} /*.ui-dialog{position:fixed!important} fixes it but effects don't work*/ .ui-dialog {max-width:98%; border-radius:0px} .ui-dialog .ui-dialog-buttonpane button{padding:3px 8px; margin-top:0!important; margin-bottom:0!important} .ui-dialog-buttonpane{text-align:center!important} .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{float:none!important} .ui-widget-header{background:#041d3b !important; color:#F0F0F0!important} .ui-state-disabled{opacity:0.65!important; filter:Alpha(Opacity=65)} .ui-dialog-titlebar{border-radius:0px} .guidance{position:relative;overflow:hidden} .guide{display:none; padding:0!important; width:217px; position:relative!important; text-align:justify!important; z-index:2!important; font-family:Tahoma, Helvetica, sans-serif!important; font-size:13px!important; background:#FCFCFC!important} .guide > div{padding:0 5px; clear:both} .guide h2{text-align:center} .redhilight{box-shadow:0 0 10px #ff0000!important; border:1px solid red!important} #pdfreader{margin:10px 0; text-align:center; font-style:italic} .paypalfooter{text-align:center} .paypalfooter > a{display:inline-block} .breg{padding:0 50px 5px 5px!important; background:right url('img/read-manual.png') no-repeat; cursor:pointer; text-align:left} #delcode,#pickcode,#addcode{display:none; position:absolute; font-size:14px; padding:8px 0 0 5px; color:#000080} #pickcode,#addcode{padding-top:10px} #delcode a, #pickcode a, #addcode a{color:#000080} #delcode a:hover, #pickcode a:hover, #addcode a:hover{color:#B00000} .bfooter{text-align:right} #homeproducts a{color:black} #homeproducts a.hover{color:#B00000} #CEbox,#whywin,#pricewin,#compwin,#whydoorwin,#optimawin,#animwin{display:none; cursor:pointer; text-align:center} #Adbox,#Atbox{text-align:center; cursor:pointer} #whywin,#whydoorwin{text-align:left; font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:15px; line-height:150%; padding-top:15px; padding-bottom:15px} #optimawin{text-align:left; font-family:opensansR, Tahoma, Geneva, sans-serif} #whywin b, #whydoorwin b{display:inline-block; width:135px; text-align:right} #pricewin{text-align:left; font-family:opensansR, Tahoma, Geneva, sans-serif; font-size:14px; line-height:150%; padding-top:10px; padding-bottom:5px} .brochurehover h3{text-decoration:underline} #brochures img{ display:inline-block; -webkit-transition-duration:0.4s; transition-duration:0.4s; -webkit-transition-property:-webkit-transform; transition-property:transform; box-shadow:0 0 1px rgba(0, 0, 0, 0) } .brochurehover img{border:1px solid #000080; -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1)} .brochurepop span{border:1px solid #000080; border-radius: 5px;} .brochurepop span:hover{-webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1)} .redhelp,.redhelp2{width:73px; height:30px; margin-top:28px; position:absolute; display:none; background:url('img/red-help.png') no-repeat; z-index:50} .redhelp2{background:url('img/red-help2.png') no-repeat} .redhelpC,.redhelpD{width:227px; height:171px; margin:-20px 0 0 -30px; position:absolute; display:none; background:url('img/red-circle.png') no-repeat; z-index:50} .redhelpD{background:url('img/red-circle1.png') no-repeat} #redguidance{font-size:13px} #redguidance .button{float:right; margin:5px 5px 0 0; padding-left:4px; padding-right:4px} .whitetip{background:#FFF!important} .payside,.deliveryside{cursor:pointer} .payside b, .sealside b{display:block; margin-top:4px} .deliveryside img{border:none; margin-bottom:4px} .deliveryside span{font-size:15px; font-weight:bold; padding:4px 0 0 6px; display:inline-block} .deliveryside a{color:#FFFFFF; line-height:125%; font-size:12px; background:url('img/deliveryvan.png') no-repeat; width:100%; height:65px; display:block; text-align:left; padding-left:9px} .reviews{margin-bottom:0!important; font-size:14px!important} .reviews span{background:url('img/stars.png') no-repeat; display:block; width:110px; margin:2px auto} .reviews a{color:black} .reviews b{font-size:13px} .social{text-align:center; width:134px; float:right} .social a{display:inline-block; width:24px; height:24px; margin:0 2px; background:url('img/social.png') no-repeat} .thumb2{float:right; width:180px} .thumb2:hover{border:1px solid #C00000} /* select with 32x24 icons */ #coloursf-menu .ui-widget, #coloursd-menu .ui-widget{font-size:12px} #coloursf-menu .ui-state-active, #coloursd-menu .ui-state-active, #threshold-menu .ui-state-active{font-weight:normal; color:#000} #coloursf-button span.ui-selectmenu-text, #coloursd-button span.ui-selectmenu-text{padding:3px 0 3px 30px; font-weight:normal} #coloursf-menu .ui-menu-item, #coloursd-menu .ui-menu-item{padding:6px 0 6px 38px; background-repeat:no-repeat} #coloursf-menu .ui-menu-item .ui-icon, #coloursd-menu .ui-menu-item .ui-icon{width:32px; height:24px; top:0.1em} .ImgSelected{position:absolute; width:32px; height:24px; left:2px; right:auto; margin-top:-12px; /* 24/2*/ top:50%; background-size:32px 24px; background-repeat:no-repeat} .OptlstFilterImg{background-size:32px 24px; background-repeat:no-repeat} #threshold-button span.ui-selectmenu-text{padding:2px 2px 2px 5px; font-weight:300;font-size:13px} .h2center{text-align:center; margin:35px 0 5px 0; font-size:19px} .backF8{background-color:#F8F8F8; border:1px solid purple} @media print{ .pagebreak{page-break-after:always} .noprint{display:none} .backF8{background-color:#FFFFFF; border:none} .backtext{font-size:13px} } #listtab{font-size:14px; border-collapse:collapse} #listtab th{font-weight:normal; font-size:14px; font-style:italic; color:#777} #listtab select{width:110px} #listtab input[type=text]{width:30px; font-size:14px} #listtab .rpad{text-align:right; padding-right:15px} #listtab img{border:1px #404040 solid; border-radius:6px; margin-right:5px} /* checkbox toogle */ .toggle-slide{overflow:hidden; cursor:pointer; -webkit-touch-callout:none; direction:ltr} .toggle-slide .toggle-on,.toggle-slide .toggle-off,.toggle-slide .toggle-blob{float:left} .toggle-slide .toggle-blob{ position:relative; z-index:99; cursor:grab; cursor:-moz-grab; cursor:-webkit-grab} .toggle-modern .toggle-slide{ border-radius:4px; text-shadow:0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.2); background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #c0c5c9), color-stop(1, #a1a9af)); background-image:-webkit-linear-gradient(#c0c5c9, #a1a9af); background-image:-moz-linear-gradient(#c0c5c9, #a1a9af); background-image:-o-linear-gradient(#c0c5c9, #a1a9af); background-image:-ms-linear-gradient(#c0c5c9, #a1a9af); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c0c5c9', endColorstr='#a1a9af'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#c0c5c9', endColorstr='#a1a9af')"; box-shadow:inset 0 2px 1px rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.15), 0 1px 0 rgba(255, 255, 255, 0.15) } .toggle-modern .toggle-slide .toggle-on, .toggle-modern .toggle-slide .toggle-off{ -moz-transition:all 0.1s ease-out; -webkit-transition:all 0.1s ease-out; -o-transition:all 0.1s ease-out; transition:all 0.1s ease-out; color:white; text-shadow:1px 1px rgba(0, 0, 0, 0.1); font-size:1em; font-weight:700; box-shadow:inset 0 2px 0 rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.2), inset 0 -1px 1px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2) } .toggle-modern .toggle-slide .toggle-off,.toggle-modern .toggle-slide .toggle-off.active{ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #737e8d), color-stop(1, #3f454e)); background-image:-webkit-linear-gradient(#737e8d, #3f454e); background-image:-moz-linear-gradient(#737e8d, #3f454e); background-image:-o-linear-gradient(#737e8d, #3f454e); background-image:-ms-linear-gradient(#737e8d, #3f454e); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#737e8d', endColorstr='#3f454e'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#737e8d', endColorstr='#3f454e')" } .toggle-modern .toggle-slide .toggle-on,.toggle-modern .toggle-slide .toggle-on.active{ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #4894cd), color-stop(1, #2852a6)); background-image:-webkit-linear-gradient(#4894cd, #2852a6); background-image:-moz-linear-gradient(#4894cd, #2852a6); background-image:-o-linear-gradient(#4894cd, #2852a6); background-image:-ms-linear-gradient(#4894cd, #2852a6); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4894cd', endColorstr='#2852a6'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#4894cd', endColorstr='#2852a6')" } .toggle-modern .toggle-select .toggle-off, .toggle-modern .toggle-select .toggle-on{background:none} .toggle-modern .toggle-slide .toggle-blob{ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #c0c5c9), color-stop(1, #81898f)); background-image:-webkit-linear-gradient(#c0c6c9, #81898f); background-image:-moz-linear-gradient(#c0c6c9, #81898f); background-image:-o-linear-gradient(#c0c6c9, #81898f); background-image:-ms-linear-gradient(#c0c6c9, #81898f); background-image:linear-gradient(#c0c6c9, #81898f); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c0c6c9', endColorstr='#81898f'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#c0c5c9', endColorstr='#a1a9af')"; box-shadow:inset 0 2px 0 rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.2), inset 0 -1px 1px rgba(0, 0, 0, 0.1), 1px 1px 2px rgba(0,0,0,0.2); border-radius:3px } .toggle-modern .toggle-slide .toggle-blob:hover{ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #a1a9af), color-stop(1, #a1a9af)); background-image:-webkit-linear-gradient(#a1a9af, #81898f); background-image:-moz-linear-gradient(#a1a9af, #a1a9af); background-image:-o-linear-gradient(#a1a9af, #a1a9af); background-image:-ms-linear-gradient(#a1a9af, #a1a9af); background-image:linear-gradient(#a1a9af, #a1a9af); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a1a9af', endColorstr='#a1a9af'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#a1a9af', endColorstr='#a1a9af')" } /* Smooth zoom */ /* Wrapper for image centering */ .lightwrap{position:fixed; z-index:20001; top:0; left:0; width:100%; height:100%; text-align:center; cursor:pointer; cursor:zoom-out; cursor:-webkit-zoom-out; cursor:-moz-zoom-out} /* overlay covering website */ #lightbg{position:fixed; display:none; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.3); z-index:20000; transition:opacity 0.5s} .lightwrap img{border: none !important;background:white;display:inline; left:0; top:0; width:auto; height:auto; max-width:100%; max-height:100%; border:2px outset #EEE; z-index:2; opacity:0; transition:opacity 0.5s} .lightwrap img.morph{border:0; width:100%; height:100%; position:absolute; z-index:-1; opacity:1} .lightwrap img.nomorph{display:none!important} .lightwrap span{top:3px; right:3px; position:absolute; width:32px; height:32px; background:url('/img/X.png') no-repeat} #lightzoomed, .zoomClose, .lightwrap img.morph1{opacity:0; transition:opacity 0.5s} .zoomClose {z-index:10002} .zoomedcontainer{position:fixed; max-width:98%; max-height:98%; transition:all 0.5s; transform:translate(0, 0); z-index:10001} .zoomedimagecontainer{position:absolute; top:50%; transform:translateY(-50%);max-height:100%} #off-screen{position:fixed; right:100%; opacity:0} .zoomedButtons{ background:linear-gradient(90deg, rgba(255,255,255,0.2) 0%, rgba(0,0,0,0) 27%, rgba(0,0,0,0) 72%, rgba(255,255,255,0.2) 100%); z-index:10002;top:50%;opacity:0; transition:all 0.5s; left:50%; transform:translate(-50%, -50%);position:absolute;max-width:100%} .zoomedButtonLeft,.zoomedButtonRight{ position:absolute;bottom:0; top:0;width:50%; background-image:url(img/slick.svg); background-repeat:no-repeat; background-position:97% 50%; cursor:pointer; background-size:40px; z-index:2; } .zoomedButtonLeft{left:0;transform:scaleX(-1);padding-left:10px} .zoomedButtonRight{right: -3px;padding-right:10px} /* Number +/- */ .n_style input{display:inline-block; width:30px; vertical-align:middle; text-align:center; border:none; font-size:15px; color:#000} .n_style span{position:relative; display:inline-block; vertical-align:middle; width:20px; height:20px; border-radius:50%; cursor:pointer} .n_style span.number-minus{border:2px solid #fe0021} .n_style span.number-minus::after{content:""; position:absolute; left:50%; top:50%; margin:-1px 0 0 -5px; width:10px; height:2px; background-color:#fe0021} .n_style span.number-plus{border:2px solid #00fe02} .n_style span.number-plus::after{content:''; position:absolute; top:50%; left:50%; margin:-1px 0 0 -5px; width:10px; height:2px; background-color:#00fe02} .n_style span.number-plus::before{content:''; position:absolute; top:50%; left:50%; margin:-5px 0 0 -1px; width:2px; height:10px; background-color:#00fe02} .n_style span.disabled{border:2px solid #a4a3a0} .n_style span.disabled::after,.n_style span.disabled::before{background-color:#a4a3a0} /*.n_style input[type='number']{-moz-appearance:textfield} .n_style input::-webkit-outer-spin-button, .n_style input::-webkit-inner-spin-button{-webkit-appearance:none} */ /* Jquery UI to changes to keep the updated version like the old one */ #glazing .ui-checkboxradio-radio-label{padding-right:1px !important;padding-left:1px !important} .ui-tooltip{ padding:8px; position:absolute; z-index:9999; max-width:300px; -webkit-box-shadow:0 0 5px #aaa; box-shadow:0 0 5px #aaa } .ui-menu .ui-icon{ position:absolute; top:0; bottom:0; left:.2em; margin:auto 0 } .ui-checkboxradio-icon{display:none} .ui-checkboxradio-icon-space{display:none} .ui-checkboxradio-radio-label{ display:inline-block; position:relative; padding:0; line-height:normal; cursor:pointer; vertical-align:middle; text-align:center; padding:3px 3px!important; margin-right:-.1em!important; font-size:14px!important; text-shadow:0 0 3px rgba(255, 255, 255, 0.5); font-weight:300; font-size:13px } .ui-state-hover, .ui-state-active , .ui-button:hover, .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{font-weight:300} .ui-controlgroup{display:inline-block} .ui-selectmenu-button{padding:0} .ui-selectmenu-button span.ui-selectmenu-text{ text-align:left; padding:0.4em 2.1em 0.4em 1em; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .ui-selectmenu-button span.ui-icon{ right:0.5em; left:auto; margin-top:-8px; position:absolute; top:50% } .ui-button-text{font-weight:300;font-size:14px!important} .ui-menu-item{position:relative} .ui-menu-item .ui-icon{padding:0} .ui-menu-item .ui-state-active, .ui-menu-item .ui-state-active:hover{border:0} .ui-visual-focus{box-shadow:none} table{text-align:left} .ui-controlgroup label:first-of-type{ border-bottom-left-radius:6px; border-top-left-radius:6px } .ui-controlgroup label:last-of-type{border-bottom-right-radius:6px;border-top-right-radius:6px} .ui-menu-item:hover{background:#ddd url('lib/images/ui-bg_inset-soft_100_dddddd_1x100.png') 50% 50%;background-repeat:repeat-x!important} /* gallery */ .galleryScroll img{vertical-align:middle; width:204px; height:170px; padding:5px;} .galleryScroll{position:relative; overflow:hidden; white-space:nowrap; max-width:100%} .galleryScroll div{display:inline-block; position:relative;} .maingal{background: transparent; margin:10px auto 0 auto; position:relative;} .maingal.max5{/*max-width:1070px !important;*/} .SlickForward, .SlickBack{ background-image:url('img/slick.svg'); background-repeat:no-repeat; content:''; cursor:pointer; display:block; height:20px; opacity:0.6; position:absolute; top:72px; width:20px; } .carticonsdesktop > span {position:relative; top:3px} .SlickBack{left:-28px;transform:scaleX(-1)} .SlickForward{right:-29px} .SlickBack:hover,.SlickForward:hover{opacity:1} .maingalcontainer{margin:10px auto;} .main.contact{position:relative;margin-top:0; padding-bottom:0;box-sizing:border-box;padding-left:76px!important;width:100%} /* responsive */ #callback{text-align:center} #phonenum{height:40px;display:table-cell;vertical-align:middle} .icn{position:absolute;left:10px} .aluminiumand{margin:0 8px} .cquestion button{text-align:left!important} .desktop{display:inline} td.desktop{display:table-cell} .desktopBlock{display:block} .hideDesktop{display:none} #mobileMenuBlocker{display:none; opacity:0; transition:opacity 0.5s} .mobileMenuContainer > a > div{background-image:url('img/MobileMenuSprite2.png');width:29px;height:23px;display:inline-block;margin-right:5px} .mmenuwindowDoor{background-position-x:-30px} .mmenuvideoGuides{background-position-x:-60px} .mmenuorderTracking{background-position-x:-90px} .mmenudelivery{background-position-x:-120px} .mmenupayment{background-position-x:-150px} .mmenubrochures{background-position-x:-180px} .mmenuinstallg{background-position-x:-210px} .mmenubuildingreg{background-position-x:-240px} .mmenuprice{background-position-x:-270px} .mmenuterms{background-position-x:-300px} .mmenuprivacy{background-position-x:-330px} .mmenureturns{background-position-x:-360px} .mmenuquestions{background-position-x:-390px} .mmenureviews{background-position-x:-420px} .mmenuabout{background-position-x:-450px} .mmenucontact{background-position-x:-480px} .mmenuinstallation{background-position-x:-540px} .sidebar.bottom, .smallMobile, #mobileMenu, .menublackbar,.smallDesktop,.mobile,.mobileBlock,.mobileFlex,.tabletInline, table.extraupvceditor .vtoptext{display:none} .sidebar.bottom .social{width:auto;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;background:transparent;border:0} #mainheadline .twolines{display:none} .latestnews.mobileBlock{position:relative;overflow:hidden} .latestnews.mobileBlock{overflow:hidden;position:relative} .latestnews.mobileBlock span{width:100%;display:inline-block} .latestnews.mobileBlock span > div{display:inline-block} .cillwarningmobile{display:none; width:100%; text-align:center; font-size:13px} .cillwarningmobile div i{width:100%; font-size:12px} .windowsizingwarning {position:relative;max-width:777px;width:100%;height:auto;margin:15px auto 0 auto; text-align:center} .windowsizingwarning img{max-width:800px; height:auto; width:100%;} .cillwarningdesktop{display:block; position:absolute; max-width:305px; left:30%;} .cillwarningdesktop div i{font-size:14px} .headtext > span{display:inline-block} .latestnews.mobileBlock > div{ position:absolute; width:100%; height:100%; transform:translateX(100%); white-space:nowrap; will-change:transform } .thankyouW-img-mob{display:none} .windowinput{width:35px} #heightdiv,#lengthdiv{width:93px} .upvcwindows .maincontent>div.desktop{display:flex} .upvcwindows .maincontent>div.mobile,.retrievecartmobile{display:none} .measurefeature video{background:black} .bottomwindowsize{padding-right:7px;position:relative;top: -4px;display:flex} #whywinajax b{min-width:115px} .guidancemobile {display:none} .windowSelector {max-width:1250px} .windowSelector.noflexbasis>div {justify-content:space-around} .windowSelector.noflexbasis a{flex-basis:auto!important;padding:10px 0!important;margin:0!important} #tdiw2,#fwidth2 {position:relative!important;display:flex} .ui-draggable .ui-dialog-titlebar{padding:6px 14px;height:19px;min-height:19px} .ui-dialog .ui-dialog-title{margin:0} .guidancedesktop >div{float:right;position:absolute!important;margin-left:16px} .guidancedesktop.guidancemobileplaceholder>div{position:relative!important;display: block!important;} .guidancedesktop{overflow:visible} .mainFlex{display:flex} .mainFlex-tilt{display:flex; justify-content:center; width:100%;} .inline411{display:none} #carttab td .mobile{display:none} .cartmobile{display:none} .windowSelector.flush>div a{min-width:152px} .windowSelector>div{display:flex;flex-wrap:wrap;justify-content:space-between} .windowSelector a{margin-bottom:25px} .windowSelector a.disabled{cursor:default;opacity:0.5} .windowSelector a.disabled div:after{content:unset!important} .windowSelector a{height:66px;display:block;text-align:center;padding:10px 12px;position:relative} .windowSelector a:hover{transform:scale(0.92);} .windowSelector a span{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);font-weight:bold} .windowSelector a div{position:relative;background-image:url('https://www.modernupvcwindows.co.uk/img/home/windowtypessprite0.png'); display:inline-block; height:80px; width:87px;} .windowSelector a.t1 div{background-position:0px 0} .windowSelector a.t2 div{background-position:-90px 0} .windowSelector a.t3 div{background-position:-179px 0} .windowSelector a.t4 div{background-position:-268px 0} .windowSelector a.t5 div{background-position:-357px 0} .windowSelector a.t6 div{background-position:-446px 0} .windowSelector a.t7 div{background-position:-535px 0} .windowSelector a.t8 div{background-position:-624px 0} .windowSelector a.t9 div{background-position:-713px 0} .windowSelector a.t24 div{background-position:-802px 0} .windowSelector a.t31 div{background-position:-2940px 0; width:85px;} .windowSelector a.t10 div{width:128px;background-position:-891px 0} .windowSelector a.t11 div{width:128px;background-position:-1021px 0} .windowSelector a.t12 div{width:128px;background-position:-1149px 0} .windowSelector a.t13 div{width:128px;background-position:-1278px 0} .windowSelector a.t14 div{width:128px;background-position:-1407px 0} .windowSelector a.t15 div{width:128px;background-position:-1536px 0} .windowSelector a.t16 div{width:128px;background-position:-1665px 0} .windowSelector a.t17 div{width:128px;background-position:-1794px 0} .windowSelector a.t18 div{width:168px;background-position:-1923px 0} .windowSelector a.t19 div{width:168px;background-position:-2092px 0} .windowSelector a.t20 div{width:168px;background-position:-2261px 0} .windowSelector a.t21 div{width:168px;background-position:-2429px 0} .windowSelector a.t22 div{width:168px;background-position:-2598px 0} .windowSelector a.t23 div{width:168px;background-position:-2767px 0} .windowSelector a.tf4 div{background-position:-759px 0; width:81px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t25 div{background-position:-0px 0; width:84px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t27 div{background-position:-85px 0; width:125px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t28 div{background-position:-211px 0; width:125px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t29 div{background-position:-464px 0; width:125px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t30 div{background-position:-336px 0; width:126px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t26 div{background-position:-590px 0; width:165px; background-image:url('img/home/windowFRsprite0.png');} .windowSelector a.t1-tilt div{width:133px; height:120px; background-position:-0px 0; background-image:url('img/home/windowTTsprite0.png');} .windowSelector a.t2-tilt div{width:133px; height:120px;background-position:-135px 0; background-image:url('img/home/windowTTsprite0.png');} .windowSelector a.t3-tilt div{width:133px; height:120px;background-position:-269px 0; background-image:url('img/home/windowTTsprite0.png');} .windowSelector a.t10-tilt div{width:194px; height:120px;background-position:-403px 0; background-image:url('img/home/windowTTsprite0.png');} .windowSelector a.t18-tilt div{width:248px; height:120px;background-position:-598px 0; background-image:url('img/home/windowTTsprite0.png'); } .animation-Tilt{animation-name:showTypesTilt; animation-duration:5s; animation-iteration-count:infinite;} .animation-win{animation-name:showTypes; animation-duration:5s; animation-iteration-count:infinite;} .animation-french{animation-name:showFrenchTypes; animation-duration:5s; animation-iteration-count:infinite;} /* windows types */ @keyframes showTypes { 0%{ background-image: url('https://www.modernupvcwindows.co.uk/img/home/windowtypessprite0.png')} 40%{ background-image: url('https://www.modernupvcwindows.co.uk/img/home/windowtypessprite1.png')} 60%{ background-image: url('https://www.modernupvcwindows.co.uk/img/home/windowtypessprite2.png')} 90%{ background-image: url('https://www.modernupvcwindows.co.uk/img/home/windowtypessprite0.png')} } @keyframes showTypesTilt { 0%{ background-image: url('img/home/windowTTsprite0.png')} 40%{ background-image: url('img/home/windowTTsprite1.png')} 60%{ background-image: url('img/home/windowTTsprite2.png')} 90%{ background-image: url('img/home/windowTTsprite0.png')} } @keyframes showFrenchTypes{ 0%{ background-image: url('img//home/windowFRsprite0.png')} 50%{ background-image: url('img//home/windowFRsprite1.png')} } .upvcdiyalum{position:absolute;bottom:48px;right:17px;background:rgba(195,223,239,0.2);} .guidancemobileplaceholder{visibility:hidden;pointer-events:none;display:none!important;position: absolute;right:1000%} .i848{display:none} .dialog-auto-height > .ui-dialog-content{height:auto!important;min-height:530px!important} .Gcoloursh .centerimg img {max-height:231px; width:auto;} #zoomimg, #inimg { width: auto; height: auto; max-width: 100%; max-height:calc(100vh - 70px)!important; } @media all and (-ms-high-contrast:none) { .slidingtypesSelectPage .slidingtypes { justify-content:space-around; } .slidingtypesSelectPage .slidingtypes > div { min-width:220px; } } @media only screen and (min-width:1025px) { .guidancedesktop{min-width:235px} } @supports not (-ms-high-contrast:none) { @media only screen and (max-width:1310px){ .slidingtypesSelectPage .slidingtypes > div{padding:0 5px} .maingal{width:1030px}} @media only screen and (max-width:1233px){ .windowSelector.flush>div a{ min-width:unset} } @media only screen and (max-width:1105px){ .slidingtypesSelectPage .slidingtypes { gap:0 41px; } .wdesigner #bottomtxt,.udesigner #bottomtxt,.kdesigner #bottomtxt,.rdesigner #bottomtxt {font-size: 12px;} .maingal,.maingal.max5{width:824px} } @media only screen and (max-width:1159px){ .fdoor-main-child2{max-width:1100px; width:100%} .fdoor-main-child2 .fdoorframes #f10{margin-top:23px;} .fdoor-main-child2 .fdoorframes #f12{margin-top:0px;} .fdoor-main{justify-content:center;} } @media only screen and (max-width:1050px) { .wht-header-hide{display:block} .wht-header{display:none} .btnpas24{left:10px;} } @media only screen and (max-width:1039px){ #doormembers a{min-width:140px} #doormembers .break{display:none} } @media only screen and (max-width:1025px){ .wdesigner #bottomtxt,.udesigner #bottomtxt,.rdesigner #bottomtxt,.kdesigner #bottomtxt {margin-right:0;width:100%;font-size:13px;} .main{padding-left:0!important;padding-right:0!important} .faqpage .main{padding:10px!important} .mobilePadding{padding-left:5px!important;padding-right:5px!important} .mobiledesigner #preview{width:100%;padding:0} .mobiledesigner .koutsideview{margin:10px!important} .mobiledesigner .kestimatedheight{text-align:center;margin-top:10px} .mobiledesigner #preview table{width:auto;image-rendering:optimizequality;will-change:transform} .measurefeature #preview form > div {width:100%} .sidebar.bottom .iconlist{ float:none; display:flex; flex-direction:row; width:100%; justify-content:space-around; align-items:center; padding:0; box-sizing:border-box; border:0; margin-bottom:0; flex-wrap:wrap; background:transparent } .sidebar.bottom .iconlist > div{float:none;padding:0;margin:10px 0!important} .mobiledesigner .guidance{display:none} .mobiledesigner .guidancemobile{display:flex;padding:0!important;perspective-origin:0 0} .mobiledesigner .guidancemobile > div{width:220px;cursor:pointer} .btnpas24{left:35px;} .mobiledesigner .maincontainer { display:flex; flex-direction:column } .mobiledesigner .maincontainer > *{ width:100%; margin:0; padding:0!important; display:flex; justify-content:center; justify-content:space-around; justify-content:space-evenly; margin-bottom:13px } .mobiledesigner > td {padding:0!important} #topmenu{margin-bottom:0} .mobiledesigner .maincontainer{ padding-top:13px; overflow:hidden; position:relative } .mobiledesigner .designcenter,.mobiledesigner table {width:100%} .tabletInline {display:inline-block} .desktopBig{display:none;} .guidancemobileplaceholder{visibility:hidden;pointer-events:none;display:flex!important;width:auto!important} .slider-hide{display:none;} .slider-text div {font-size:18px; transform:scale(0.95);} .mainslide .slider-text{margin:5px} .mainslide .slider-title{margin-top:5px} .mainslide li{margin-top:-10px;} .ecerti{width:140px;height:140px} .recerti{width:200px;height:100px} } @media only screen and (max-width:989px){ .maincontent{width:100%!important} .sidebar.right{display:none} .sidebar.bottom,.maingal .back{display:block} .maingal{margin:0 auto!important} .upvcdiyalum{position:relative;bottom:0;right:0;} #doorfamilies{justify-content:space-around} .doormembersahover {transform: scale(1)} .happytohelp{font-size:14px;} .slider-text div span{font-size:17px; transform:scale(0.9);} .slider-title{font-size:14px} } @media only screen and (max-width:950px){ #topmenu a, .cartdesktop > b, .cartmobile > b{font-size:15px} } @media only screen and (max-width:938px){ .tlf-header-hide{display:block; font-size:15px; margin-top:-3px;} .cont-header{display:none} } @media only screen and (max-width:900px){ .mobileincpadd{padding-left:4px!important} .maingal,.maingal.max5{width:618px} .topreviews{display:none!important} .ftopRow3 div b{font-size:16px} .ftopRow3 div a{padding:5px} .infimg290{width:250px; height:160px} } @media only screen and (max-width:897px){ #address_listb{margin-left:0!important;width:100%!important;max-width:none!important} #delivAddr, #deloption{position:unset} #deloption{text-align:center;width:100%;display:block} #havedeladdr {position:relative;top:4px} #deloption > *{ float:none!important;display:inline-block} #delivAddr th{display:table-cell} .cartOrderInstructions { width:302px!important;height:77px} .ordertab th, .ordertab td{width:auto!important} .ordertab {width:100%} } @media only screen and (max-width:848px){ .slidingtypesSelectPage .slidingtypes {gap:0 14px} .h848{display:none !important} .hide-french{display:none !important;} .i848{display:inline-block} .fdoorframes a{flex:auto} .backtext {font-size:12px!important} #scrolldiv {min-height:300px!important} .mobileautoHeight {height:auto!important} #doormembers a{min-width:100px} /* Slider */ .slider-text div span{font-size:17px; transform: scale(0.85);} .slider-title{font-size:13px} } @media only screen and (max-width:835px){ .slidingtypesSelectPage .slidingtypes{gap:unset;justify-content:space-evenly} #bottomtxt >span{padding:0!important;margin:0!important} #preview {width:100%} #bottomtxtContainer {flex-direction:column} .inviewbtn, .btnpas24{top:0!important} .inviewbtn.desktop{display: none !important} .inviewbtn,.animbtn, .btnpas24{margin:5px 0 5px 0 !important; position:relative; text-align:center; width:100%; display:block; float:none;left:0;right:0} .desktop,.desktopBlock,td.desktop,tr.desktop{display:none} .text-box-desktop, .text-box-desktop:after{display:none} .text-box-mobile, .text-box-mobile:after{display:inline-block;} .mobileBlock{display:block} .mobileFlex{display:flex;align-items: center} .mobileFlex > * {width: 100%} #ourwindows{text-align:left} .infothumb{margin:0 0 0 20px} .hideDesktop{display:inline-block} .smallDesktop{display:inline-block} .measurefeature >tbody > tr > td{ display:block; width:100% } .windowinput{width:30px} #heightdiv,#lengthdiv{width:auto} .headtext{font-size:14px} .slidingtypes.marg {padding:15px 0!important} .slidingtypes > div{flex:none!important;text-align:center} .slidingtypes a{float:unset; display:inline-block;margin:5px} #pickcode,#addcode,#delcode{transform:translateY(7px)} h1{font-size:20px} .infxp{max-width:70%;} } @media only screen and (max-width:800px){ .glass-header{display:none} } @media only screen and (max-width:782px){ .windowSelector>div {justify-content:space-evenly} } @media only screen and (max-width:761px){ .doorcolouritems.korniche.wide a {width:135px;height:230px!important} .doorcolouritems.korniche.wide .doorcolourselimg {height:193px!important} .bayUPVCWindow #selectbox>div{min-width:205px} .sidebar.bottom .social{width:auto; flex-direction:row;width:190px;height:auto} .ui-draggable{ position:fixed!important; top:50%!important; transform:translateY(-50%)!important; left:1px!important; right:1px!important; width:auto!important; max-height:100%; z-index:10000; } #compwin{padding:9px 0!important} #compwin ol{margin:0 0 0 27px!important} body.has-popup{overflow:hidden!important} #SP-doorcontainer br{display: none} #SP-doorcontainer h4,#SP-doorcontainer button{display: block} .ui-dialog.ui-draggable{display:flex;flex-direction:column} .ui-dialog.ui-draggable .ui-dialog-content{flex-grow:1} .ui-dialog.ui-draggable #doorcolourpicker, .ui-dialog.ui-draggable #frameColourPickerin, .ui-dialog.ui-draggable #frameColourPickerout {height:100%!important} .ui-dialog.ui-draggable .doorcolouritems >div{display:flex;flex-direction:row;flex-wrap:wrap;max-width:100%;justify-content:space-evenly;box-sizing:border-box} .ui-dialog.ui-draggable .doorcolouritems > div.ral, .ui-dialog.ui-draggable .doorcolouritems > div.ral_inb {display:block} .ui-dialog.ui-draggable .ral2,.ui-dialog.ui-draggable .ral1 {width:100%} .main-slide{display:flex; flex-direction:column; background:transparent;} #slides{height:150px; text-align:center; } #slides .goback{left:5px} .slidesdiv1{text-align:center; width:100%; height:100%;background: #2d3d59;} .slidesdiv2{text-align:center; width:100%} .home-video video{height:auto; max-width:760px; width:100%} .slider-text div{display:none} .slider-title{display:none;} .img-banner{max-width:760px} .slides-left{flex-direction:column; background:linear-gradient(180deg, #2d3d59, #2d3d59 51%, transparent 51%, transparent); height:260px} .slides-design-img{margin:0 auto; max-width:761px; width:100%} .slides-design .slider-text{display:none;} .slides-design .img-banner{/*margin:none !important;*/} .slides-left-child{height:130px; padding:1% 0 0 0;} .mainslide li{margin-top:0px; padding:0px; width:100% !important} } @media only screen and (max-width:750px){ .tiltturnbackbutton a{display: block} .tiltturnbackbutton {top:-50px} .priceg{ top:10px; left:23px; background-color:#0000009e; border-radius:25%; padding:6px } .optimag{top:89px;left:33px;background:url('img/heritage-mob.png')} .tickt1 h4, .tickt2 h4, .tickt3 h4{width:100%} .fn750{float:none!important} .b750{display:block!important} .m10750{margin:10px 0!important} .c750{text-align:center;position:relative;left:50%;transform:translateX(-50%);max-width:100%;height:auto} } @media only screen and (max-width:734px){ .slidingtypesSelectPage .slidingtypes {gap:0 0} .thankyouW-img-desk{display:none} .thankyouW-img-mob{display:block} .thankyouW .competition-text {font-size:14px} .thankyouW .competition-text span{font-size:13px} .thankyou-desktop{display:none} .thankyouW .mainh1{font-size:17px!important} .mainInfo{flex-direction:column;} .infimg290{width:230px; height:140px} } @media only screen and (max-width:700px){ .return-trade{text-align:center !important; margin:10px auto; padding-left:0px !important;} .hide700{display:none!important} .s700{visibility:visible!important} .headerCart{ position:absolute; right:0; top:0 } #topmenu td{ height:30px; background-size:contain; vertical-align:middle; text-align:center; display:table-cell } .maingal,.maingal.max5{width:408px} .cillwarningmobile{display:block} .cillwarningdesktop{display:none} table.extraupvceditor td{display:block;width:100%} table.extraupvceditor td .main2{margin:0!important;border-radius:0} table.extraupvceditor .windetails{width:100%;border-radius:6px 6px 0 0;box-sizing:border-box} table.extraupvceditor .windetails #doorcolour{float:none} table.extraupvceditor #cill_diagram img{max-width:100%} .fbuttons td{ display: inline-flex; padding: 0!important;width:auto!important;justify-content: center;align-items: center} .fbuttons tr{display: flex!important;justify-content: space-evenly;padding: 0 3px} html body .fbuttons td.backtext{justify-content: flex-end!important;flex-grow: 1;padding-right: 5px!important;} .measurement-row-div{padding:20px} } @media only screen and (max-width:650px){ #videoext{padding:10px !important;margin:0 auto !important} .happytohelp{display:none} .faqpage .arrowContainer {display:none} .faqpage .replydisplay {display:none} .faqpage #faq dl.selected {max-height:200px;transition:max-height 0.25s ease-in} .mobiledesigner h1, .designcenter > h1, .designcenter > h1, .designcenter > h1 > * {font-size:18px} .fbuttonssplitbuttondata {display:none!important } .fbuttonssplitmbutton {display:block!important; } /* .fbuttonssplit tr {margin-right:24px;}*/ } @media only screen and (max-width:627px){ #checkoutdelinput, #delinfo { display:inline-flex!important; width:auto!important; padding-top:10px!important;align-items: center; } #checkoutdelinput .button{ height:20px;margin-left:4px} .sidebar.bottom .iconlist div.social{ flex-direction:row; width:120px; height:117px; border:1px #404040 solid; border-radius:6px; margin-bottom:13px; background-color:#FEFEFE; font-size:12px; font-family:Arial; text-align:center; overflow:hidden } .cartbuttontable tr{ display:flex;flex-direction:column;align-items:center; padding-bottom:10px} .cartchooserow > td > span{display:block;width:100%;text-align:center} #delcode{width:100%} #delcode table {width:100%} #deltd {padding-bottom:32px} #delcode tr,#delcode td,.mcenter,#spendmore {display:block;width:100%;text-align:center;float:unset; top:0!important;position:relative;transform:translateY(0)} #pickcode,#addcode{width:100%;text-align:center;float:unset; top:0!important;position:relative} #spendmore{padding:5px} #delset .ui-checkboxradio-radio-label {border:1px solid darkgray} .cartmobile{display:block} .cartdesktop{display:none} .cartbuttons {display:flex; flex-direction:row; width:100%!important; justify-content:space-evenly} #pickcode, #addcode, #delcode{transform:translateY(0)} input[name="delarea"] {width:50px} } @media only screen and (max-width:621px){ .doorcolouritems.korniche.wide a {width:100px;height:179px!important} .doorcolouritems.korniche.wide .doorcolourselimg {height:142px!important} .tiltturnbackbutton {float:none;top:0;text-align: center} .tiltturnbackbutton a{display: inline-block} #whydoorwin, #whywin{padding-left: 0px;padding-right: 0px} .glass-header{display:block;} .tlf-header-hide span {font-size:15px} #search-txt{font-size:15px} } @media only screen and (max-width:680px){ #homeproducts > div{margin-bottom:10px; min-width:140px;} #homeproducts > div > a{width:110px;} #homeproducts > div > a > span{transform:scale(0.9); transform-origin:left;} #homeproducts > div > a> div{font-size:12px} #w5 span{margin-left:-5px !important} #d3 span{margin-left:-3px !important} #d7 span, #d0 span, #w6 span, #d12 span{margin-left:9px !important} #d11 span, #w3 span, #w0 span, #w1 span{margin-left:4px !important} #d1 span, #w2 span{margin-left:25px !important} #d6 span, #d10 span{margin-left: 20px !important} #d11 a span:hover {transform:scale(0.88);} } @media only screen and (max-width:609px){ .mobiledesigner .ui-controlgroup .ui-checkboxradio-radio-label{padding:3px 1px !important} #doormembers a{min-width:88px} } @media only screen and (max-width:600px){ .tabletFont15{font-size:15px!important} .ui-dialog-content{padding:15px 5px 0 5px!important} #whydoorwin tr, #whywin tr{border-bottom:1px dotted black;display:block} #whydoorwin b, #whywin b{width:111px} .cemarkicon img{margin:0!important} #carttab tr { display:flex; flex-direction:column; align-items:center; border-bottom:1px solid lightgray; box-sizing:border-box; } #carttab td { display:block; width:100%; text-align:center; box-sizing:border-box; } #carttab .totalinfo { display:flex; justify-content:center; } #carttab .totalinfo input {padding-left:4px; margin:0;} #carttab td .mobile { height:0; display:flex; width:61px; justify-content:space-evenly; } #carttab .desktop,.carticonsdesktop {display:none!important} #scrolldiv {min-height:auto!important} } @media only screen and (max-width:582px){ #homeproducts > div{min-width:122px; margin: 0 5px 10px 5px;} #homeproducts > div > a{width:122px;} #homeproducts > div > a > span{transform:scale(0.8); transform-origin:left;} #homeproducts > div > a> div{white-space:normal} #w5 span{margin-left:8px !important} #d3 span, #w7 span{margin-left:9px !important} #d7 span, #d0 span, #w6 span, #d11 span, #w3 span, #w0 span, #w1 span, #d12 span, #d2 span{margin-left:16px !important} #d1 span{margin-left:35px !important} #d6 span, #d10 span, #w2 span{margin-left: 30px !important} #w4 span{margin-left: 24px !important} #d11 a span:hover {transform:scale(0.78);} .slides-left-child{padding:2% 0 0 0;} .newproduct img{transform: scale(0.8); margin:-44px 0 0 -10px !important;} .decosmall{clip-path:polygon(100% 0%, 100% 100%, 30% 100%);} .infxpsmall{min-height:240px !important;} .bld{flex-flow:column-reverse;} } @media only screen and (max-width:556px){ .upvcwindows .maincontent>div.desktop{display:none} .upvcwindows .maincontent>div.mobile{display:flex;justify-content:space-around} #ralselection_out,#ralselection_in{margin-bottom:15px} #doormembers a{min-width:88px} } @media only screen and (max-width:550px){ .extras #selectbox > div {min-width:202px} #imgtab >div { width:260px} #whywin{padding:0!important} .smallDesktop,.hideMobile,#zoombutton,.simplemobiletable .hideonmobile{display:none} .mobileautoheight{height:100%!important} .simplemobiletable td{display:block; width:100%;text-align:center} .mobile{display:inline-block} .headtext{font-weight:normal} .mobileBlock{display:block} .mobile100{width:100%} .menublackbar{display:table-cell} .mobileMenuOpen #mobileMenu{left:0} .redContainerVisible #slides div h4,.redContainerVisible #slides .goback, .redContainerVisible #slides .goforward{display:none!important} .redContainer2 > div {top:-312px} .redContainer2::after{top:-33px} #hamburgericon{vertical-align:middle; display:inline-block; width:34px; height:20px; left:15px; background:url('/img/hamburger.png') no-repeat center;} #mobileMenu{ display:block; position:fixed; top:0; left:0; width:250px; bottom:0; background-color:#d9d9d9; background-image:linear-gradient(315deg, #d9d9d9 0%, #f6f2f2 74%); z-index:9999; left:-250px; transition:left 0.5s } #mobileMenu img{ width:250px; height:auto; filter:invert(1) } .mobileMenuContainer{ display:flex; flex-direction:column; height:100% } #mobileMenu a{ min-height:32px; max-height:50px; width:100%; flex:1; font-size:16px; padding-left:5px; display:flex; flex-direction:row; justify-content:left; } #mobileMenu > div{ position:absolute; top:60px; right:0; bottom:0; left:0; overflow-y:auto; overflow-x:hidden } .mobileMenuOpen #mobileMenuBlocker{ display:block; position:fixed; top:0; left:0; bottom:0; right:0; z-index:9998; background:black; opacity:0.4 } .designcenter > h1 { padding:0!important } .freedeliverydown .freedeliveryimg{display: none} .freedeliverydown .freedeliveryimg.mobile{width:100%;text-align: center;display: inline-block;padding: 5px 0} .freedeliverydown .freedeliveryimg.mobile img{position: relative!important} .retrievecartmobile{display:table-row} .retrievecartmobile > td {text-align:right} .retrievecartmobile > td > * { margin:5px} .retrievecartdesktop{display:none} .slides-left{flex-direction:column; background:linear-gradient(180deg, #2d3d59, #2d3d59 65%, transparent 65%, transparent); height:260px} .slides-left-child{padding:3% 0 0 0;} #slides{height:170px; text-align:center; } .img-banner{margin:7px auto auto !important;} .mainInfo p{text-align:left;} } @media only screen and (max-width:529px) { #doormembers a{min-width:unset} .ftopRow2 div{text-align:center;} } @media only screen and (max-width:525px){ #tablehead2{margin:0;padding:0} .aluminiumand{display:none} .main.designcenter > h1{ padding-right:90px} .maingalcontainer{position:relative;background:transparent;} .maingal::after{content: '';position:absolute;background:linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(255,255,255,0.5) 100%);top:0;left:0;right:0;bottom:0;pointer-events:none} .maingal{position:unset} .SlickBack{z-index:2;left:0;background-position:50%;height:100%;top:0;width:50px;background-size:20px} .SlickForward{z-index:2;right:0;background-position:50%;height:100%;top:0;width:50px;background-size:20px} .freedelivtopicon{width:50px;height:auto} #instructions, .ordertab,.ordertab tbody, .ordertab tr,.ordertab th, .ordertab td{display:block!important; width:100%;text-align:center} .ordertab input {margin:2px} .bottombuttonsmobile {display:flex;flex-direction:column-reverse;align-items:center} .bottombuttonsmobile > a {padding:15px} #homeproducts > div{min-width:110px; margin: 0 5px 10px 5px;} #homeproducts > div > a{width:110px;} #homeproducts > div > a > span{transform:scale(0.7); transform-origin:left;} #homeproducts > div > a> div{white-space:normal} #w5 span{margin-left:8px !important} #d3 span, #w7 span{margin-left:9px !important} #d7 span, #d0 span, #w6 span, #d11 span, #w3 span, #w0 span, #d12 span{margin-left:20px !important} #d1 span{margin-left:30px !important} #w1 span{margin-left:15px !important} #d6 span, #d10 span, #d9 span{margin-left: 30px !important} #w4 span{margin-left: 24px !important} #d11 a span:hover {transform:scale(0.68);} } @media only screen and (max-width:498px){ #contactlist button{display:inline-grid} #doormembers a{min-width:100px} .tlf-header-hide span {font-size:14px} #search-txt{font-size:14px} .cart-number b{top:24%} .cart-icon-full{height:33px} .infimg290{width:200px; height:110px} } @media only screen and (max-width:480px){ .guideContent {padding:0;box-sizing:border-box} .guidance {width:220px;box-sizing:border-box} #homeproducts > div{min-width:90px; padding:10px; margin: 0 4px 10px 4px; padding: 0 10px 10px 0; max-height:100px;} #homeproducts > div > a{width:90px;} #homeproducts > div > a > span{transform:scale(0.6); transform-origin:left; margin-top:-15px;} #homeproducts > div > a> div{white-space:normal; margin-top:-20px;} #w5 span{margin-left:12px !important} #d3 span, #w7 span{margin-left:10px !important} #d7 span, #d0 span, #w6 span, #d11 span, #w3 span, #w0 span{margin-left:13px !important} #d1 span{margin-left:25px !important} #w1 span, #d12 span{margin-left:18px !important} #d6 span, #d10 span, #d9 span, #d4 span, #d8 span, #d5 span{margin-left: 30px !important} #w4 span{margin-left: 24px !important} #d11 a span:hover {transform:scale(0.58);} } @media only screen and (max-width:468px){ #whywin{font-size:12px} #whywinajax tr td:first-child{padding:0} #whywinajax b{min-width:92px} #mainheadline .twolines{display:inline-block} #mainheadline .oneline{display:none} .redContainer2 > div {top:-332px} .redContainer2::after{top:-53px} #bottomtxt.chooseown {font-size:20px!important} #bottomtxt.chooseown button {font-size:15px} table.extraupvceditor .vtoptext{display:block;font-size:16px} table.extraupvceditor .vrighttext2{display:none!important} table.extraupvceditor .zoomicon{bottom:15px!important;left:initial!important;right:40px!important;position:absolute!important} .ui-dialog-content table, .ui-dialog-content table label{font-size:12.5px!important;} .infxpsmall{min-height:260px !important; max-width:70% !important;} } @media only screen and (max-width:451px){ #homeproducts a{width:121px} .tiltAndTurn .mainFlex{flex-direction:column-reverse;align-items:center} #glassmenu {padding:7px 1px 0 1px!important} #glassmenu .ui-widget.ui-widget .ui-button-text{font-size:12px !important} #glassmenu table{display:block;border-spacing:0} #glassmenu table tbody{display:inline-block;border-spacing:1px 13px} .ftopRow3 div b{font-size:15px} } @media only screen and (max-width:449px){ body .mobiledesigner .ui-controlgroup .ui-checkboxradio-radio-label{padding:3px 1px !important} .smallMobile{display:inline-block} .hideSmallMobile{display:none} .contactfile{padding-left:0;padding-right:0} .latestnews.mobileBlock span > div{display:none} .guide{height:100%} .guidance {box-sizing:border-box;width:220px} .guidance >div {box-sizing:border-box;width:220px} .guidancemobile{width:0;position:relative} .guidancemobile,.guidancemobile>div{position:absolute!important;image-rendering:optimizequality;will-change:transform;transform-origin:center left;overflow:visible!important} .guideContent > div {padding:0} .guidancemobile .guide{height:100%!important;width:220px!important} .maincontainer .windetails {image-rendering:optimizequality;will-change:transform; transform-origin:center right} .windetails {box-sizing:border-box} .mobiledesigner .maincontainer > *{justify-content:space-between;position:relative} .guidancemobile{width:0; position:absolute; right:0; bottom:0; top:0} .mobilefont16 {font-size:15px!important} } @media only screen and (max-width:436px){ .freedelivtopicon{margin-top:30px!important} .mobilefrenchdetailsh1 {font-size:17px} .cartbuttons > a > span {text-align:center} .glass-header{display:none;} #homeproducts > div{min-width:70px; padding:10px; margin: 0 4px 10px 4px; max-height:80px;} #homeproducts > div > a{width:70px;} #homeproducts > div > a > span{transform:scale(0.5); transform-origin:left; margin-top:-30px} #homeproducts > div > a> div{white-space:normal;} #w5 span{margin-left:3px !important} #d3 span, #w7 span{margin-left:3px !important} #d2 span, #d11 span {margin-left: 5px !important;} #d7 span, #d0 span, #w6 span, #d11 span, #w3 span,#w1 span, #w0 span{margin-left:8px !important} #d1 span, #w2 span{margin-left:20px !important} #d10 span{margin-left:17px !important} #d6 span, #d10 span, #d9 span, #d4 span, #d8 span, #d5 span{margin-left: 22px !important} #w4 span, #d12 span{margin-left:12px !important} #d11 a span:hover{transform:scale(0.48);} .newproduct img{transform: scale(0.7); margin:-55px 0 0 -25px !important;} .ftopRow3 div b{font-size:14px; padding:2px} } @media only screen and (max-width:420px){ #contactfrm .or{display:block;width:50%;text-align:center} #mainheadline{font-size:15px} .extras #selectbox > div {min-width:0} .extras #selectbox > div img{min-width:0;height:172px;width:auto} } @media only screen and (max-width:411px){ .maingal,.maingal.max5{width:230px} .galleryScroll img{border:0} .maingal::after,.maingalcontainer{background:unset} .hide411{display:none} .inline411{display:inline-block} } @media only screen and (max-width:400px){ .continueShopping{display: none} .doorcolouroutopt{max-height:240px!important} .raltable{width:100%} .main.contact{padding-left:61px} .icn{left:-5px!important} .main.contact {padding-left:62px !important} .windowspecialtitle{font-size:20px} .doorcolouroutopt,.doorcolouroutopt1 {max-width:141px} .doorcolourselimg {max-height:200px;max-width:141px} .doorcolouritems.wide > div{width:100%!important} .fonton400to19{font-size:19px!important} .ui-dialog-content table .ui-controlgroup{margin-right:0!important} .bifolddoorsback{ padding-left:0!important; text-align:center!important; } .ftopRow3 div b{font-size:13px; padding:1px} .newproduct img{transform: scale(0.7); margin:-45px 0 0 -10px !important;} .infxp{min-height:230px; max-width:80%} } @media only screen and (max-width:390px ){ #homeproducts > div{min-width:90px; padding:10px; margin: 0 4px 10px 4px; padding: 0 10px 10px 0; max-height:100px;} #homeproducts > div > a{width:90px;} #homeproducts > div > a > span{transform:scale(0.6); transform-origin:left; margin-top:-15px;} #homeproducts > div > a> div{white-space:normal; margin-top:-20px;} #w5 span{margin-left:10px !important} #d3 span, #w7 span{margin-left:10px !important} #d7 span, #d0 span, #w6 span, #d11 span, #w3 span, #w0 span{margin-left:16px !important} #d1 span{margin-left:25px !important} #w1 span, #d12 span{margin-left:18px !important} #d6 span, #d10 span, #d9 span, #d4 span, #d8 span, #d5 span, #w2 span{margin-left: 30px !important} #w4 span{margin-left: 24px !important} #d2 span{margin-left: 13px !important;} #d11 a span:hover {transform: scale(0.58);} .slides-left-child{padding:4% 0 0 0;} .newproduct img{transform: scale(0.7);} .ui-dialog-content table, .ui-dialog-content table label{font-size:11px!important;} } @media only screen and (max-width:365px ){ .searchInput:focus{width:130px; padding-left:32px;} } /** window selector Responsive */ @media only screen and (max-width:1237px){.windowSelector a{flex-basis:11%}} @media only screen and (max-width:845px){.windowSelector a{flex-basis:0}} @media only screen and (max-width:770px){.windowSelector a{flex-basis:15%}} @media only screen and (max-width:765px){.windowSelector a{flex-basis:14%}} @media only screen and (max-width:748px){.windowSelector a{flex-basis:13%}} @media only screen and (max-width:657px){.windowSelector a{flex-basis:0}} @media only screen and (max-width:657px){.windowSelector a{flex-basis:17%}} @media only screen and (max-width:618px){.windowSelector a{flex-basis:13%}} @media only screen and (max-width:554px){.windowSelector a{flex-basis:20%}} @media only screen and (max-width:520px){.windowSelector a{flex-basis:0;padding:0;margin:2px 2px 25px 2px} } }