/** 1. ttm-row 2. Row-Equal-Height 3. Bg-Layer 4. Row-Bg-Image 5. Col-Bg-Image 6. Section-Title 7. sep_holder 8. Buttons 9. Icons 10. Fid 11. featured-icon-box 12. Featured-imagebox 13. Progress-Bar 14. Testimonial 15. Client-row 16. Accordion 17. Wrap-Form 18. Tab 19. Boxes-Spacing 20. Sidebar **/ /* =============================================== 1.ttm-row
------------------------*/
.ttm-row{ padding: 100px 0;}
.ttm-row.padding_bottom_zero-section { padding: 100px 0 0; }
.ttm-row.padding_top_zero-section { padding: 0 0 100px 0; }
.ttm-row.padding_zero-section { padding: 0 0; }
.ttm-row.broken-section { padding: 0 0; }
.ttm-row.client-section { padding: 30px 0; }
.ttm-row.grid-section { padding: 25px 0; }
.ttm-row.sidebar { padding: 70px 0 90px; } /* =============================================== 2.Row-Equal-Height
------------------------*/
.row-equal-height{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;}
.row-equal-height > [class*='col-'] { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
} /* =============================================== 3.Bg-Layer ------------------------*/
.ttm-bg{ position: relative;}
.ttm-col-bgimage-yes{ z-index: 1; }
.bg-layer-equal-height .ttm-col-bgimage-yes, .bg-layer-equal-height .ttm-col-bgcolor-yes{ height: 100%;
}
.ttm-bg-layer , .ttm-titlebar-wrapper .ttm-titlebar-wrapper-bg-layer, .ttm-col-wrapper-bg-layer-inner { position: absolute; height: 100%; width: 100%; top: 0; left: 0;
}
.ttm-left-span > .ttm-col-wrapper-bg-layer { width: auto; margin-left: -500px; right: 0;
}
.ttm-right-span > .ttm-col-wrapper-bg-layer { width: auto; margin-right: -500px; right: 0;
} .layer-content{ position: relative; z-index: 1; height: 100%; width: 100%; } .bg-layer { position: relative; }
.bg-layer > .container > .row { margin: 0; }
.bg-layer > .container , .bg-layer > .container-fluid { padding: 0; } .ttm-bg.ttm-bgimage-yes >.ttm-bg-layer ,
.ttm-bg.ttm-col-bgimage-yes > .ttm-bg-layer > .ttm-col-wrapper-bg-layer-inner { opacity: .65; } .ttm-bgcolor-white.ttm-bg.ttm-bgimage-yes >.ttm-bg-layer, .ttm-bgcolor-white.ttm-bg.ttm-col-bgimage-yes > .ttm-bg-layer > .ttm-col-wrapper-bg-layer-inner { opacity: .94;
} /* =============================================== 4.Row-Bg-Image ------------------------*/
.bg-img1{ background-image: url(../images/bg-image/row-bgimage-1.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; background-attachment: fixed;
}
.bg-img2{ background-image: url(../images/home/bg-blue.jpg); background-repeat: no-repeat; background-size: cover; background-position: 95% bottom;
}
@media (max-width: 1750px) { .bg-img2{ background-position: center; }
}
@media (max-width: 991px) { .bg-img2{ background-position: left; padding-bottom: 50px !important; }
}
.bg-img3{ background-image: url(../images/bg-image/row-bgimage-3.png); background-repeat: no-repeat; background-position: left top;
}
.bg-img4{ background-image: url(../images/bg-image/row-bgimage-4.jpg); background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: center;
}
.bg-img5{ background-image: url(../images/bg-image/row-bgimage-5.jpg); background-repeat: no-repeat; background-size: cover; background-position: center;
}
.bg-img6{ background-image: url(../images/bg-image/row-bgimage-6.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; background-attachment: fixed;
} .row-map1{ background-image: url(../images/bg-image/row-map1.png); background-repeat: no-repeat; background-position: center;
}
.row-pattern-1 { background-image: url(../images/bg-image/row-pat11.png); background-repeat: no-repeat; background-position: top left;
} /* =============================================== 5.Col-Bg-Image ------------------------*/
.ttm-equal-height-image{ display: none; }
.col-bg-img-one.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-1.png); background-position: center; background-size: cover;
}
.col-bg-img-two.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-2.png); background-position: center; background-size: cover;
}
.col-bg-img-two.ttm-col-bgimage-yes > .ttm-bg-layer > .ttm-col-wrapper-bg-layer-inner { opacity: .02;
}
.col-bg-img-three.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/home/about-sys.jpg); background-position: left center; background-repeat: no-repeat; background-size: cover;
}
.col-bg-img-four.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/home/export-network.jpg); background-position: center; background-size: cover;
}
.col-bg-img-five.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-5.jpg); background-position: center; background-size: cover; margin-right: -300%;
}
.col-bg-img-six.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-6.jpg); background-position: center center; background-size: cover; background-repeat: no-repeat;
}
.col-bg-img-seven.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/our-products/sidebar-image.jpg) !important; background-position: center !important; background-size: cover !important; background-repeat: no-repeat !important;
}
.col-bg-img-eight.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-8.jpg) !important; background-position: center !important; background-size: cover !important; background-repeat: no-repeat !important;
}
.col-bg-img-nine.ttm-col-bgimage-yes > .ttm-col-wrapper-bg-layer { background-image: url(../images/bg-image/col-bgimage-9.jpg) !important; background-position: center !important; background-size: cover !important; background-repeat: no-repeat !important;
} /* =============================================== 6.Section-Title ------------------------*/
.section-title{ position: relative; margin-bottom: 12px; margin-top: -4px;
}
.section-title h3{ font-weight: 600; display: inline-block; text-transform: uppercase; font-size: 16px; line-height: 17px; margin-bottom: 11px; padding-left: 18px; position: relative;
}
.section-title h3:before,
.section-title h3:after { left: 0; right: auto; background-color: #13c5dd; width: 2px; height: 100%; content: ""; position: absolute; transform: rotate(16deg); top: 0;
}
.section-title h3:before { left: 6px; } .section-title h2.title{ font-weight: 700; text-transform: capitalize; font-size: 34px; line-height: 44px; margin-bottom: 10px;
}
.section-title .title-desc p{ padding-bottom: 15px; margin: 0;
}
.section-title h2.title.fs-48 { font-size: 48px; line-height: 62px;
} .section-title.title-style-center_text { text-align: center;
}
.section-title.title-style-center_text .title-desc p{ margin-bottom: 15px; width: 54%; margin: 0 auto;
}
.section-title .title-header { padding-bottom: 11px; } /* style2 */
.section-title.style2 { margin-bottom: 22px; }
.section-title.style2 .title-header{ width: 57%; padding-right: 30px; padding-bottom: 0; position: relative;
}
.section-title.style2 .title-header:after { content: ""; right: 50px; height: 90%; position: absolute; top: 0; width: 0; border-right: 1px solid #e7e7e7; transform: rotateZ(-165deg); left: auto;
}
.ttm-bgcolor-grey .section-title.style2 .title-header:after { background-color: #d6dbe8;
}
.section-title.style2.without-sep .title-header:after{ content: unset; }
.section-title.style2 .title-desc{ padding-right: 20px;
}
.section-title.style2 .title-desc p { margin-bottom: 0; padding-bottom: 10px;
}
.section-title.style2 .title-header,
.section-title.style2 .title-desc{ display: table-cell; vertical-align: middle;
} /* =============================================== 7.sep_holder
------------------------*/
.ttm-horizontal_sep { border-top: 1px solid #ebebeb; display: block; position: relative;
}
.ttm-bgcolor-darkgrey .ttm-horizontal_sep{ border-top-color: rgba(255,255,255,0.08);
}
.ttm-bgcolor-skincolor .ttm-horizontal_sep{ border-top-color: rgba(255,255,255,0.2);
}
.ttm-bgcolor-white .ttm-horizontal_sep{ border-top-color: #f1f1f1;
}
.border, .border-top, .border-left, .border-bottom, .border-right { border-color: #ebf0f4 !important;
}
.ttm-bgcolor-darkgrey .border,
.ttm-bgcolor-darkgrey .border-top,
.ttm-bgcolor-darkgrey .border-left,
.ttm-bgcolor-darkgrey .border-bottom,
.ttm-bgcolor-darkgrey .border-right,
.ttm-bgcolor-skincolor .border,
.ttm-bgcolor-skincolor .border-top,
.ttm-bgcolor-skincolor .border-left,
.ttm-bgcolor-skincolor .border-bottom,
.ttm-bgcolor-skincolor .border-right{ border-color: rgba(255,255,255,0.06) !important;
} .ttm-vertical_sep > [class*='col']:not(:last-child):before { position: absolute; content: ""; height: 100%; top: 0; right: 0; width: 1px; background-color: rgba(0, 0, 0, 0.06);
}
.row.no-gutters.ttm-vertical_sep > [class*='col']:not(:last-child):before{ right: 0; }
.ttm-bgcolor-darkgrey .ttm-vertical_sep > [class*='col']:not(:last-child):before,
.ttm-bgcolor-skincolor .ttm-vertical_sep > [class*='col']:not(:last-child):before { background-color: rgba(255,255,255,.21);
} /* =============================================== 8.Buttons
------------------------*/
.ttm-btn{ display: inline-block; vertical-align: middle; font-size: 14px; line-height: normal; padding: 11px 32px 11px 31px; background: transparent; border-width: 2px ; border-style: solid; border-color: #eaeff5; position: relative; text-transform: uppercase; font-weight: 700; overflow: hidden; z-index: 1; transition: all 0.5s ease 0s;
}
.ttm-btn:not(.btn-inline)::before { content: ''; position: absolute; background-color: #343434; width: 0%; height: 100%; right: 0; left: auto; top: 0; -webkit-transition: .4s all ease-in-out; -o-transition: .4s all ease-in-out; transition: .4s all ease-in-out; z-index: -1;
}
.ttm-btn:not(.btn-inline):hover::before{ right: auto; left: 0; width: 100%;
} .ttm-btn.ttm-icon-btn-left{ padding-left: 22px; transition: unset;}
.ttm-btn.ttm-icon-btn-right{ padding-right: 22px; transition: unset;}
.ttm-btn.ttm-icon-btn-right i{ right: 2px; } .ttm-bgcolor-darkgrey .ttm-btn:hover.btn-inline.ttm-btn-color-skincolor { background-color: transparent; color: #fff;
}
.ttm-btn.ttm-btn-style-fill:hover { background-color: transparent !important; }
.rev-btn.ttm-btn.ttm-btn-style-fill:hover { background-color: transparent; border-color: currentColor;}
.rev-btn.ttm-btn.ttm-btn-style-fill:before { position: unset; background-color: transparent;} /** btn-with-icon **/
.ttm-btn i{ display: inline-block; vertical-align: middle; text-align: inherit; transition: .4s; font-weight: bold;
}
.ttm-btn.ttm-icon-btn-right i { text-align: right; margin-left: 10px; margin-right: 0;}
.ttm-btn.ttm-icon-btn-left i { text-align: left; margin-right: 10px; margin-left: 0;} /** btn-size-xs **/
.ttm-btn.ttm-btn-size-xs { font-size: 11px; padding: 8px 20px;}
.ttm-btn.ttm-btn-size-xs i { font-size: 11px; line-height: 11px;}
.ttm-btn.ttm-icon-btn-right.ttm-btn-size-xs i { text-align: right; margin-left: 6px; margin-right: 0;}
.ttm-btn.ttm-icon-btn-left.ttm-btn-size-xs i { text-align: left; margin-right: 6px; margin-left: 0;} /** btn-size-sm **/
.ttm-btn.ttm-btn-size-sm { font-size: 13px; padding: 11px 20px; }
.ttm-btn.ttm-btn-size-sm i { font-size: 12px; line-height: 12px;} /** btn-size-md **/
.ttm-btn.ttm-btn-size-md { font-size: 13px; padding: 13px 34px 12px 34px;}
.ttm-btn.ttm-btn-size-md i { font-size: 16px; line-height: 20px; } /** btn-size-lg **/
.ttm-btn.ttm-btn-size-lg { font-size: 18px; line-height: 18px; padding: 11px 35px;}
.ttm-btn.ttm-btn-size-lg i { font-size: 18px; line-height: 18px;} /** btn-shape **/
.ttm-btn.ttm-btn-shape-round { border-radius: 2em; }
.ttm-btn.ttm-btn-shape-rounded { border-radius: 3px; }
.ttm-btn.ttm-btn-shape-square { border-radius: 0; } /** btn-style-border **/
.ttm-btn.ttm-btn-style-border{ background-color: transparent; border: 2px solid currentColor; }
.ttm-btn.ttm-btn-color-white.ttm-btn-style-border { color: #fff; border-color: #fff; background-color: transparent;
} /** btn-inline **/
.ttm-btn.btn-inline{ text-transform: uppercase; padding: 0; border: 0; background-color: transparent;
}
.ttm-btn.btn-inline i{ display: inline-block; vertical-align: unset; transition: 0s;
}
.ttm-btn.btn-inline.ttm-icon-btn-right i{ margin-left: 7px; }
.ttm-btn.btn-inline.ttm-icon-btn-left i{ margin-right: 7px; }
.ttm-btn.btn-inline i.fa-minus:before { height: 1px; display: block; } /* play-btn / play-icon */
.ttm-play-icon { color: #fff; display: block; position: relative;
}
.ttm-play-icon .ttm-icon.ttm-icon_element-size-md{ height: 95px; width: 95px; line-height: 95px; margin: 0;
}
.ttm-play-icon .ttm-play-icon-animation{ display: inline-block; position: relative;
}
.ttm-play-icon .ttm-play-icon-animation:after, .ttm-play-icon .ttm-play-icon-animation:before { content: ''; border: 1px solid; border-color: inherit; width: 150%; height: 150%; -webkit-border-radius: 100%; border-radius: 100%; position: absolute; left: -25%; top: -25%; opacity: 1; -webkit-animation: 1s videoplay-anim linear infinite; animation: 1s videoplay-anim linear infinite;
}
.ttm-play-icon .ttm-play-icon-animation:after, .ttm-play-icon .ttm-play-icon-animation:before { -webkit-animation:videoplay-anim 1.05s infinite; -moz-animation:videoplay-anim 1.05s infinite; -ms-animation:videoplay-anim 1.05s infinite; -o-animation:videoplay-anim 1.05s infinite; animation:videoplay-anim 1.05s infinite;
}
.ttm-play-icon .ttm-play-icon-animation:after{ border-color: #bfbfbf;
}
.ttm-play-icon .ttm-play-icon-animation:before { border-color: #e4e4e4; -webkit-animation-delay: .5s; animation-delay: .5s;
} .ttm-play-icon-btn .ttm-icon.ttm-icon_element-size-sm{ display: block; height: 50px; width: 50px; line-height: 50px; margin: 0; z-index: 2;
}
.ttm-play-icon-btn .ttm-icon.ttm-icon_element-size-sm i.fa-play{ padding-left: 5px; font-size: 20px; display: inline-block; vertical-align: middle; line-height: 0;
}
.ttm-play-icon-btn .ttm-icon.ttm-icon_element-size-md { display: block; height: 56px; width: 56px; line-height: 56px; margin: 0; z-index: 2;
}
.ttm-play-icon-btn .ttm-icon.ttm-icon_element-size-md i.fa-play{ font-size: 23px; z-index: 2;
}
i.fa-play{ padding-left: 5px; }
.ttm-play-icon-btn .ttm-play-icon-animation{ position: relative; display: inline-block;
}
.ttm-play-icon-btn .ttm-play-icon-animation .ttm-icon { margin-bottom: 0; }
.ttm-play-icon-btn .ttm-play-icon-animation .ttm-icon:after, .ttm-play-icon-btn .ttm-play-icon-animation .ttm-icon:before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 50%;
}
.ttm-play-icon-btn .ttm-play-icon-animation .ttm-icon:after{ z-index: 1; width: calc(100% * 1.4 ); height: calc(100% * 1.4 ); opacity: .3; background-color: inherit;
}
.ttm-play-icon-btn .ttm-play-icon-animation .ttm-icon:before { width: calc(100% * 1.7 ); height: calc(100% * 1.7 ); opacity: .5; background-color: inherit;
}
.ttm-bgcolor-skincolor .ttm-play-icon-btn .ttm-play-icon-animation:after { opacity: .1; }
.ttm-bgcolor-skincolor .ttm-play-icon-btn .ttm-play-icon-animation:before { opacity: .3;} .ttm-play-icon-btn:hover .ttm-play-icon-animation .ttm-icon:after, .ttm-play-icon-btn:hover .ttm-play-icon-animation .ttm-icon:before{ -webkit-animation:sep-anim 1.05s infinite; -moz-animation:sep-anim 1.05s infinite; -ms-animation:sep-anim 1.05s infinite; -o-animation:sep-anim 1.05s infinite; animation:sep-anim 1.05s infinite;
}
@-webkit-keyframes sep-anim{ 100% { width:200%;height:200%;opacity:0 } }
@keyframes sep-anim{ 100% { width:200%;height:200%;opacity:0 } } /* =============================================== 9.Icons
------------------------*/
.ttm-icon{ margin-bottom: 25px; display: inline-block; vertical-align: middle; text-align: center; border: 1px solid transparent; position: relative; transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -webkit-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; box-sizing: content-box; position: relative;
}
.ttm-icon i { display: inline-block; vertical-align: middle; line-height: 1; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
}
/** icon-size-xs **/
.ttm-icon.ttm-icon_element-size-xs { height: 45px; width: 45px; line-height: 45px; }
.ttm-icon.ttm-icon_element-size-xs i { font-size: 21px; } /** icon-size-sm **/
.ttm-icon.ttm-icon_element-size-sm { height: 55px; width: 55px; line-height: 55px; }
.ttm-icon.ttm-icon_element-size-sm i { font-size: 31px; } /** icon-size-md **/
.ttm-icon.ttm-icon_element-size-md { height: 67px; width: 67px; line-height: 67px }
.ttm-icon.ttm-icon_element-size-md i { font-size: 37px; } /** icon-size-lg **/
.ttm-icon.ttm-icon_element-size-lg { height: 78px; width: 78px; line-height: 78px; }
.ttm-icon.ttm-icon_element-size-lg i { font-size: 48px; } /** icon-size-xl **/
.ttm-icon.ttm-icon_element-size-xl { height: 88px; width: 80px; line-height: 88px; }
.ttm-icon.ttm-icon_element-size-xl i { font-size: 58px; } .ttm-icon.ttm-icon_element-onlytxt { height: auto; width: auto; line-height: 1;}
.ttm-icon.ttm-icon_element-onlytxt i { position: relative; top: 0; left: 0; -webkit-transform: unset; -ms-transform: unset; -o-transform: unset; transform: unset; -webkit-transform: translate(0,0); -ms-transform: translate(0,0); -o-transform: translate(0,0); transform: translate(0,0); transform: translate(0,0);
} /** icon-shape **/
.ttm-icon.ttm-icon_element-style-round { border-radius: 5px; }
.ttm-icon.ttm-icon_element-style-rounded { border-radius: 50%; }
.ttm-icon.ttm-icon_element-style-square { border-radius: 0;} /* ttm-list-style-icon */
.ttm-list { list-style: none; padding: 0; margin: 0; font-size: 16px;
}
.ttm-list.ttm-list-style-icon.font-weight-normal li i , .ttm-list.ttm-list-style-icon.font-weight-normal .ttm-list-li-content { font-weight: normal; padding-bottom: 2px;
}
.ttm-list.ttm-list-style-icon li { position: relative; padding-bottom: 8px;
}
.ttm-list.ttm-list-style-icon li i { position: absolute; left: auto; top: 10px; font-weight: 700;
}
.ttm-list.ttm-list-style-icon li i.fa-minus:before{ position: absolute; content: ""; top: 6px; left: 0; height: 2px; width: 7px; background-color: currentcolor;
}
.ttm-list.ttm-list-style-icon .ttm-list-li-content { display: inline-block; padding-left: 30px; padding-top: 4px;
} .ttm-list.fs-14 { font-size: 14px; }
.ttm-list.fs-15 { font-size: 15px; } /* ttm-video-icon */
.ttm-video-icon .ttm-icon.ttm-icon_element-size-md { height: 98px; width: 98px; line-height: 98px;
}
.ttm-video-icon .ttm-icon.ttm-icon_element-size-md i { font-size: 40px;
}
.ttm-right-video-icon, .ttm-left-video-icon, .ttm-center-video-icon { position: absolute; left: 0; right: 0; top: 50%;
} /* =============================================== 10.Fid
------------------------*/
.inside { position: relative; transition: all .4s; padding: 10px 0 15px;
}
.ttm-fid-view-lefticon .ttm-fid-icon-wrapper ,
.ttm-fid-view-lefticon .ttm-fid-contents ,
.ttm-fid-view-righticon .ttm-fid-icon-wrapper ,
.ttm-fid-view-righticon .ttm-fid-contents{ display: table-cell; vertical-align: top;
}
.ttm-fid-view-lefticon .ttm-fid-contents,
.ttm-fid-view-righticon .ttm-fid-icon-wrapper { padding-left: 20px; text-align: left;
}
.ttm-fid-view-topicon i { margin-bottom: 10px;
}
.ttm-fid-icon-wrapper i { font-size: 45px; line-height: 50px; position: relative; display: inline-block;
}
.inside h4, .inside h4 span { font-size: 40px; line-height: 50px; font-weight: 600; margin-bottom: 0;
}
.inside h3 { margin-bottom: 0; width: 100%; font-size: 15px; line-height: 26px; font-weight: 400; padding-top: 0;
} .ttm-fid.inside.style1 { padding: 15px 0; text-align: center;
}
.ttm-fid.inside.style1 .ttm-fid-contents { padding-left: 60px; }
.ttm-fid.inside.style1 .ttm-fid-contents .ttm-fid-title { color: inherit; }
.ttm-fid.inside.style1 .ttm-fid-icon-wrapper i:before { position: absolute; content: ""; top: -10px; left: 0; height: 37px; width: 28px; background-color: #13c5dd; -webkit-mask: url(../images/fid-icon-1.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/fid-icon-1.svg); -webkit-mask-size: contain;
} .ttm-fid.inside.style2 { margin: 0; padding: 15px 40px;
}
.row > [class*='col']:first-child .ttm-fid.inside.style2 { padding-left: 0; padding-right: 60px;
}
.ttm-fid.inside.style2 h4, .ttm-fid.inside.style2 h4 span { font-size: 37px; line-height: 46px; font-weight: 600;
}
.ttm-fid.inside.style2 .ttm-fid-icon-wrapper i { font-size: 50px; line-height: 1; padding-top: 7px; font-weight: 500;
}
.ttm-fid.inside.style2 h3 { font-size: 14px; line-height: 19px; font-weight: 600; margin-bottom: 15px;
}
.ttm-fid.inside.style2 p { margin-bottom: 0; } .ttm-fid.inside.style3 h4, .ttm-fid.inside.style3 h4 span { font-size: 50px; line-height: 60px; font-weight: 600;
}
.ttm-fid.inside.style3 h3 { color: inherit; padding: 12px 0 0; font-weight: 400; font-size: 16px; line-height: 1;
} .ttm-fid.inside.style4 { padding: 10px 15px;
}
.ttm-fid.inside.style4 .ttm-fid-contents { display: table; width: 100%; }
.ttm-fid.inside.style4 .ttm-fid-contents .ttm-fid-inner, .ttm-fid.inside.style4 .ttm-fid-contents .ttm-fid-title { display: table-cell; vertical-align: middle; }
.ttm-fid.inside.style4 .ttm-fid-contents .ttm-fid-title { padding-left: 40px; }
.ttm-fid.inside.style4 .ttm-fid-contents h4 , .ttm-fid.inside.style4 .ttm-fid-contents h4 span { font-size: 48px; line-height: 48px;
} .ttm-fid-view-circle-progress { padding: 0; margin-bottom: 10px;
}
.ttm-fid-view-circle-progress .ttm-fid-contents { display: flex; align-items: center;
}
.ttm-fid-view-circle-progress .ttm-circle-content,
.ttm-fid-view-circle-progress .ttm-circle { display: inline-flex; position: relative;
}
.ttm-fid-view-circle-progress .ttm-circle-boxcontent { position: absolute; top: 51%; left: 0; width: 100%; text-align: center; -khtml-transform: translateX(0) translateY(-50%); -moz-transform: translateX(0) translateY(-50%); -ms-transform: translateX(0) translateY(-50%); -o-transform: translateX(0) translateY(-50%); transform: translateX(0) translateY(-50%)
}
.ttm-fid-view-circle-progress .ttm-fid-number,
.ttm-fid-view-circle-progress .ttm-fid-number sub,
.ttm-fid-view-circle-progress .ttm-fid-number sup { font-size: 26px; font-weight: 600;
}
.ttm-fid-view-circle-progress .ttm-fid-title { font-size: 18px; line-height: 23px; font-weight: 600; text-transform: capitalize; padding-left: 20px;
} /* =============================================== 11.featured-icon-box ( only contents )
------------------------*/
.featured-icon-box { position: relative; margin: 15px 0; }
.featured-icon-box .ttm-icon{ margin-bottom: 0; }
.featured-title h3{ font-size: 22px; line-height: 30px; margin-bottom: 12px; font-weight: 600; text-transform: capitalize;} .featured-icon-box.icon-align-before-content .featured-icon,
.featured-icon-box.icon-align-before-content .featured-content,
.featured-icon-box.icon-align-before-title .featured-title,
.featured-icon-box.icon-align-before-title .featured-icon { display: table-cell; vertical-align: middle;
}
.featured-icon-box.icon-align-before-content .featured-icon i { display: inline-block; vertical-align: middle; }
.featured-icon-box.icon-align-before-content.icon-ver_align-top .featured-icon { vertical-align: top; padding-top: 4px;
}
.featured-icon-box.icon-align-before-content .featured-content, .featured-icon-box.icon-align-before-title .featured-title{ padding-left: 15px; }
.featured-icon-box.icon-align-before-content .featured-title h3 { margin-bottom: 13px; }
.featured-icon-box.icon-align-before-title .featured-title h3{ margin-bottom: 0; }
.featured-icon-box.icon-align-before-content .featured-content .featured-desc p{ margin-bottom: 0;
}
.featured-icon-box.icon-align-before-title .featured-content{ margin-top: 15px; }
.featured-icon-box.icon-align-top-content .featured-content { padding-top: 15px; } .container-fluid, .container { counter-reset: featuredbox-number; } .featuredbox-number .ttm-num:before{ counter-increment: featuredbox-number; content: counter(featuredbox-number, decimal-leading-zero) " " ; } .featured-icon-box.icon-flip-hover .ttm-icon i { transition: all 1s ease; display: block; transform: translate(0%,0%) rotateY(0deg);
}
.featured-icon-box.icon-flip-hover:hover .ttm-icon i { transform: translate(0%,0%) rotateY(360deg);
} /* style1 */
.featured-icon-box.style1,
.featured-icon-box.style1 .ttm-icon ,
.featured-icon-box.style1 .featured-content { text-align: center; transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out;
}
.featured-icon-box.style1:hover .ttm-icon ,
.featured-icon-box.style1:hover .featured-content { transform: translateY(-10px);
}
.featured-icon-box.style1 .ttm-icon i { font-size: 45px; transition: none;
}
.featured-icon-box.style1 .ttm-icon { height: 140px; width: 140px; background-color: #fff; border-radius: 50%; margin-bottom: 20px; box-shadow: 0 0 8px 0 rgba(29, 42, 77, .11); -webkit-transition: all 0.45s ease-in-out; -moz-transition: all 0.45s ease-in-out; -ms-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out;
}
.featured-icon-box.style1 .ttm-num { width: 48px; height: 48px; border-radius: 50%; border: none; display: block; text-align: center; position: absolute; right: -10px; bottom: 0; padding: 8px; z-index: 1;
}
.featured-icon-box.style1 .ttm-num:before { position: absolute; content: ""; top: 0; left: 0; right: 0; display: block; width: 100%; border-radius: 100%; height: 100%; border: 2px solid #fff; margin: 0 auto; opacity: 0; -webkit-transition: all .8s; -moz-transition: all .8s; -ms-transition: all .8s; -o-transition: all .8s; transition: all .8s; transform: rotate(76deg);
}
.featured-icon-box.style1:hover .ttm-num:before { opacity: 1; -webkit-transform: scale(1.3); -moz-transform: scale(1.3); -ms-transform: scale(1.3); -o-transform: scale(1.3);
}
.featured-icon-box.style1 .ttm-num span{ color: #fff; font-size: 14px; font-weight: 600; display: block; width: 32px; height: 32px; border-radius: 50%; border: 1px solid rgba(255,255,255,.43); z-index: -2; line-height: 30px; text-align: center; margin: 0 auto;
}
@media (min-width: 991px) { [class*='col-']:not(:last-child) .featured-icon-box.style1 .featured-icon:before { display: block; content: ''; position: absolute; right: -64px; top: 20%; margin-top: -10px; height: 64px; width: 64px; background-image: url(../images/procedure-arrow.jpg); background-repeat: no-repeat; background-color: transparent; }
} /* style2 */
.featured-icon-box.style2 .ttm-icon { height: 81px; width: 81px; line-height: 81px; border-width: 2px; margin-bottom: 40px;
}
.featured-icon-box.style2 .ttm-icon:after { position: absolute; content: ""; left: 0; right: 0; height: 10px; width: 10px; bottom: -35px; margin: 0 auto; background-color: currentColor; border-radius: 50%;
}
.featured-icon-box.style2 .ttm-icon i { font-size: 42px; transition: all 1s ease; display: block; transform: translate(-50%,-50%) rotateY(0deg);
}
.featured-icon-box.style2:hover .ttm-icon i { transform: translate(-50%,-50%) rotateY(360deg);
}
.featured-icon-box.style2 .featured-title h3 { font-size: 16px; line-height: 24px; font-weight: 400;
} /* style3 */
.featured-icon-box.style3 { padding: 30px 30px 20px; -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); -moz-box-shadow: 0 0 12px 0 rgba(0,0,0,.1); box-shadow: 0 0 10px 0 rgb(43 52 59 / 10%);
}
.featured-icon-box.style3 .featured-desc p { font-size: 16px; line-height: 26px; margin-bottom: 5px;
}
.featured-icon-box.style3::before { content: ""; position: absolute; left: 0px; bottom: 0px; width: 100%; border-bottom: 4px solid; transition: all 0.3s ease 0s;
} /* style4 */
.featured-icon-box.style4 { text-align: center; padding: 15px 0;
}
.featured-icon-box.style4 .ttm-icon i { font-size: 45px; }
.featured-icon-box.style4 .featured-title h3 { font-size: 16px; line-height: 26px; margin-bottom: 0;
}
@media (min-width: 992px){ .row > [class*='col']:not(:last-child) > .featured-icon-box.style4:before { position: absolute; content: ""; height: 1px; width: 100%; bottom: -15px; left: 0; background-color: rgba(255, 255, 255, .20); }
} /* style5 */
.featured-icon-box.style5 { text-align: center; z-index: 0; position: relative;
}
.featured-icon-box.style5:before { content: ""; position: absolute; height: 1px; left: 0; right: 0; top: 44px; bottom: 0; margin: 0 auto; z-index: -1; background-color: #dee3f2; transition: all .4s;
}
.featured-icon-box.style5:after { content: ""; position: absolute; height: 1px; left: 0; right: 0; top: 44px; bottom: 0; margin: 0 auto; transition: all .4s; z-index: -1; animation: mymove 2s infinite;
}
@keyframes mymove { from {left:0} to {left:100%} }
.featured-icon-box.style5 .featured-content { padding: 31px 30px 0;
}
.featured-icon-box.style5 .featured-title h3 { margin-bottom: 8px;
}
.featured-icon-box.style5 .featured-content ,
.featured-icon-box.style5 .featured-icon { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.5s; -o-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s;
}
.featured-icon-box.style5:hover .featured-content ,
.featured-icon-box.style5:hover .featured-icon { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px);
}
.featured-icon-box.style5 .ttm-num span{ position: relative; font-size: 17px!important; font-weight: 600; height: 60px; width: 160px; border: 1px solid #dee3f2; display: block; line-height: 60px; text-align: center; background: #fff; margin: 0 auto; padding: 0 15px; overflow: hidden; z-index: 1; -webkit-transition: all 0.45s ease-in-out; -moz-transition: all 0.45s ease-in-out; -ms-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out;
}
.featured-icon-box.style5 .ttm-num span:before { position: absolute; content: ''; bottom: 100%; left: 0; height: 2px; width: 100%; z-index: -1; opacity: 0; -webkit-transition: .55s cubic-bezier(.68,1.55,.265,.55); -moz-transition: .55s cubic-bezier(.68,1.55,.265,.55); -ms-transition: .55s cubic-bezier(.68,1.55,.265,.55); -o-transition: .55s cubic-bezier(.68,1.55,.265,.55); transition: .55s cubic-bezier(.68,1.55,.265,.55);
}
.featured-icon-box.style5:hover .ttm-num span:before { opacity: 1; bottom: 0; height: 100%;
}
.featured-icon-box.style5:hover .ttm-num span{ color: #fff; } /* style6 */
.featured-icon-box.style6 { margin: 0; }
.featured-icon-box.style6 .featured-title h3 { font-size: 20px; font-weight: 500; font-style: italic; margin-bottom: 0;
} /* style7 */
.featured-icon-box.style7 { padding: 33px 25px 30px; border: 1px solid #e4ebff; border-right: 0; background-color: #fff;
}
.border-box { position: relative;
}
.border-box:after { position: absolute; content: ""; right: 0px; top: 15px; bottom: 15px; border-right: 1px solid #e4ebff;
}
.featured-icon-box.style7 .featured-icon { padding: 10px 0; }
.featured-icon-box.style7 .featured-desc p{ overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
}
.featured-icon-box.style7:before { content: ''; position: absolute; height: 4px; width: 100%; top: 0; left: 0; background-color: #000; opacity: 0; transform: scale(0); -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s;
}
.featured-icon-box.style7:hover:before { opacity: 1; transform: scale(1);
} /* style8 */
.featured-icon-box.style8 { position: relative; overflow: hidden; border: 1px solid rgba(0,0,0,.08); padding: 40px 15px 40px; text-align: center; z-index: 1; width: 100%; border-radius: 5px;
}
.ttm-bgcolor-darkgrey .featured-icon-box.style8 ,
.ttm-bgcolor-skincolor .featured-icon-box.style8 { border: 1px solid rgba(255,255,255,.19);
}
.featured-icon-box.style8:before { position: absolute; content: ''; bottom: 100%; left: 0; height: 100%; width: 100%; -webkit-transition: .55s cubic-bezier(.68,1.55,.265,.55); -moz-transition: .55s cubic-bezier(.68,1.55,.265,.55); -ms-transition: .55s cubic-bezier(.68,1.55,.265,.55); -o-transition: .55s cubic-bezier(.68,1.55,.265,.55); transition: .55s cubic-bezier(.68,1.55,.265,.55); background-color: #13c5dd; z-index: -1;
}
.featured-icon-box.style8:hover:before { bottom: 0;
}
.featured-icon-box.style8 .ttm-icon i { font-size: 45px; transition: all 1s ease; display: block; transform: rotateY(0deg);
}
.featured-icon-box.style8:hover .ttm-icon i { transform: rotateY(360deg); color: #fff;
}
.featured-icon-box.style8 .featured-title h3 { font-size: 16px; line-height: 30px; margin-bottom: 20px; font-weight: 400;
}
.featured-icon-box.style8 .featured-link a { font-size: 9px; height: 30px; width: 30px; line-height: 30px; text-align: center; color: #fff; border: 1px solid currentColor; border-radius: 50%; display: block; margin: 0 auto;
}
.featured-icon-box.style8 .featured-link a i { color: #fff; } /* =============================================== 12.featured-imagebox ( contents with image)
------------------------*/
.featured-imagebox { border-radius: 6px; }
.featured-imagebox,
.featured-imagebox .featured-thumbnail { position: relative; overflow: hidden; border-radius: 5px;
}
.featured-imagebox .featured-thumbnail img { -moz-transform: scale(1); -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out;
}
.featured-imagebox:hover .featured-thumbnail img{ -moz-transform: scale(1.09); -webkit-transform: scale(1.09); -ms-transform: scale(1.09); transform: scale(1.09);
}
.featured-imagebox { margin: 15px 0; border: 1px solid #40adc2; }
.featured-imagebox .featured-content .featured-title h3 { position: relative; overflow: hidden; font-size: 22px; line-height: 30px; font-weight: 600; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.featured-imagebox .featured-content .category, .featured-imagebox .featured-content .category a { font-size: 14px; line-height: 15px; margin-bottom: 0; transition: all .3s; display: inline-block;
}
.ttm-box-view-overlay , .ttm-box-view-content-inner{ position: relative; overflow: hidden;
}
.ttm-box-view-overlay:before, .ttm-box-view-content-inner:before { position: absolute; content: ""; left: 0; width: 100%; height: 100%; text-align: center; z-index: 1; opacity: 0; -webkit-transition: all .4s ease-out; transition: all .4s ease-out;
}
div:hover > .ttm-box-view-overlay:before, div:hover > .ttm-box-view-content-inner:before { opacity: .7;
} /* post */
.featured-imagebox-post { overflow: visible;
}
.featured-imagebox-post .featured-content .post-meta span{ display: inline-block; position: relative; margin-right: 20px; font-size: 14px; line-height: 14px; margin-bottom: 12px;
}
.featured-imagebox-post .featured-content .post-meta span:last-child{ margin-right: 0;
}
.featured-imagebox-post .featured-content .post-meta span:not(:last-child):after{ position: absolute; background-color: currentColor; display: inline-block; content: "/ "; color: #848e9f; width: 1px; height: 100%; border-radius: 50%; vertical-align: middle; top: 0; background-color: transparent; right: -10px;
}
.featured-imagebox-post .featured-content .post-meta span i{ padding-right: 8px; font-size: 14px; line-height: 0;
}
.featured-imagebox-post .featured-content .post-meta span i.fa-comments-o { font-size: 16px; }
.featured-imagebox-post .ttm-box-post-date .ttm-entry-date{ color: #fff; display: inline-block; padding: 20px 8px; z-index: 2; font-size: 15px;
}
.ttm-box-post-date .ttm-entry-date .entry-month, .ttm-box-post-date .ttm-entry-date .entry-year { font-size: 16px; line-height: 1; display: block; font-weight: 700; text-transform: capitalize;
}
.post-category{ display: inline-block; border-radius: 6px; font-size: 14px; line-height: 1; padding: 6px 10px; color: #fff; margin-bottom: 15px;
}
.post-bottom.ttm-post-link { display: flex; }
.ttm-post-format-video{ position: relative; overflow: hidden; padding-bottom: 67.5%; padding-top: 25px; height: 0; border-radius: 5px;
}
.ttm-post-format-video iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;
} /* post-1*/
.featured-imagebox-post.style1 { display: inline-grid; width: 100%;
}
.featured-imagebox-post.style1 .featured-content { padding-top: 20px;
}
.featured-imagebox-post.style1 .post-meta { display: block; padding: 5px 0px 0;
}
.featured-imagebox-post.style1 .ttm-box-view-overlay { border-radius: 5px; }
.featured-imagebox-post.style1 .ttm-media-link a { position: absolute; top: 41%; left: 0; right: 0; margin: 0 auto; margin-top: -1px; color: rgb(255, 255, 255); width: 35px; height: 35px; text-align: center; line-height: 35px; font-size: 13px; font-weight: 500; opacity: 0; z-index: 1; border-radius: 3px; -webkit-transition: all .9s ease; -o-transition: all .9s ease; -moz-transition: all .9s ease; transition: all .9s ease; transform: scale(0); -webkit-transform: scale(0);
}
.featured-imagebox-post.style1:hover .ttm-media-link a{ opacity: 1; transform: scale(1); -webkit-transform: scale(1);
}
.featured-imagebox-post-quoted { padding: 40px 40px 25px; background-color: #fff; text-align: center; border-radius: 6px; width: 100%; display: inline-grid;
}
.featured-imagebox-post-quoted i { display: block; font-size: 30px; margin-bottom: 20px; }
.featured-imagebox-post-quoted .ttm-post-format-title h3 { font-size: 22px; line-height: 34px; }
.featured-imagebox-post-quoted blockquote { z-index: 2; position: relative; border: 0; text-align: left; background: transparent; font-style: italic; font-size: 19px; line-height: 30px; padding: 0; margin: 0 0 7px; margin-top: -6px;
} .featured-imagebox-post-quoted blockquote cite span { position: relative; display: block; font-size: 14px; color: #848e9f !important; font-style: normal; margin-top: 12px; }
.featured-imagebox-post-quoted blockquote:before { content: ''; position: absolute; background-color: #000; right: -15px; bottom: 0; font-size: 31px; display: block; height: 29px; width: 41px; -webkit-mask: url(../images/quote-2.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/quote-2.svg); -webkit-mask-size: contain;
} /* post-2 */
.featured-imagebox-post.style2 { box-shadow: rgba(43, 52, 59, 0.1) 0px 0px 10px 0px;
}
.featured-imagebox-post.style2 .featured-thumbnail { border-radius: 0; }
.featured-imagebox-post.style2 .featured-imagebox-post-inner { border-radius: 5px; margin-top: 30px; overflow: hidden;
}
.featured-imagebox-post.style2 .featured-content { background-color: rgb(255, 255, 255); padding: 25px 25px 31px 30px;
}
.featured-imagebox-post.style2 .ttm-box-post-date { height: 84px; width: 57px; padding: 16px 5px 7px; z-index: 1; color: #0e204d; text-align: center; background-color: #fff; position: absolute; top: -20px; left: 25px; line-height: 16px; font-size: 15px; border-radius: 5px; font-size: 13px; font-weight: 500; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.5s; -o-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s; box-shadow: rgba(43, 52, 59, 0.1) 0px 0px 10px 0px;
}
.featured-imagebox-post.style2 .ttm-box-post-date span { font-size: 24px; padding-bottom: 6px; display: block; font-weight: 600;
}
.featured-imagebox-post.style2:hover .ttm-box-post-date { color: #fff; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px);
}
.featured-imagebox-post.style2 .ttm-box-post-date:before { position: absolute; content: ''; bottom: 100%; left: 0; height: 2px; width: 100%; z-index: -1; -webkit-transition: .55s cubic-bezier(.68,1.55,.265,.55); -moz-transition: .55s cubic-bezier(.68,1.55,.265,.55); -ms-transition: .55s cubic-bezier(.68,1.55,.265,.55); -o-transition: .55s cubic-bezier(.68,1.55,.265,.55); transition: .55s cubic-bezier(.68,1.55,.265,.55); border-radius: 5px;
}
.featured-imagebox-post.style2:hover .ttm-box-post-date:before { bottom: 0; height: 100%;
} .featured-imagebox-post.style3 { display: flex; justify-content: center; padding: 20px; background-color: white; box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
}
@media (max-width: 767px) { .featured-imagebox-post.style3 { display: block; }
}
.featured-imagebox-post.style3 .featured-content { padding: 20px 0 20px 20px; width: 100%;
}
@media (max-width: 767px) { .featured-imagebox-post.style3 .featured-content { padding-left: 0; }
}
.featured-imagebox-post.style3 .featured-content .post-meta,
.featured-imagebox-post-quoted.style4 .featured-content .post-meta { padding-bottom: 10px; margin-bottom: 15px; border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.featured-imagebox-post.style3 .ttm-box-post-date ,
.featured-imagebox-post-quoted.style4 .ttm-box-post-date { position: absolute; top: 0; bottom: 0; left: 0; display: flex; z-index: 2; justify-content: center; writing-mode: vertical-lr; text-orientation: mixed; transform: rotate(180deg);
}
.featured-imagebox-post.style3 .ttm-box-post-date .ttm-entry-date,
.featured-imagebox-post-quoted.style4 .ttm-box-post-date .ttm-entry-date { display: inline-block; padding: 20px 8px; z-index: 2; color: #fff; font-size: 13px; line-height: 1; font-weight: normal;
} .featured-imagebox-post-quoted.style4 { padding: 20px 20px; margin: 15px 0; border-radius: 5px; clear: both; color: #fff; overflow: hidden; -webkit-box-shadow: 0 0 8px 0 rgb(29 42 77 / 11%); -moz-box-shadow: 0 0 8px 0 rgba(29,42,77,.11); box-shadow: 0 0 8px 0 rgb(29 42 77 / 11%);
}
.featured-imagebox-post-quoted.style4 .featured-content { padding: 110px 40px; position: relative; overflow: hidden; border-radius: 5px; background-size: cover; background-position: 100%;
}
@media (max-width: 767px) { .featured-imagebox-post-quoted.style4 .featured-content { padding: 60px 40px; }
}
.featured-imagebox-post-quoted.style4 .featured-content blockquote { margin: 0 40px;
}
.featured-imagebox-post-quoted.style4 .featured-content:after { content: " "; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; background-color: rgba(0,11,39,.38);
}
.featured-imagebox-post-quoted.style4 cite span { color: #fff !important; }
.featured-imagebox-post-quoted.style4 .featured-content .featured-title h3 { font-size: 25px; z-index: 2; position: relative;
}
.featured-imagebox-post-quoted.style4 .featured-content span a { font-size: 13px; position: relative; z-index: 2; font-style: italic; overflow-wrap: break-word;
} /* services-01*/
.featured-imagebox-services.style1{ border-radius: 6px; -webkit-box-shadow: 0 0 8px 0 rgba(29, 42, 77, .11); -moz-box-shadow: 0 0 8px 0 rgba(29, 42, 77, .11); box-shadow: 0 0 8px 0 rgba(29, 42, 77, .11);
}
.featured-imagebox-services.style1 .featured-thumbnail { opacity: 0; overflow: hidden;
}
.featured-imagebox-services.style1:hover .featured-thumbnail { opacity: 1;
}
.featured-imagebox-services.style1 .featured-thumbnail:before { content: ""; position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; opacity: 0; backface-visibility: hidden; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; background-image: -webkit-linear-gradient( 90deg,rgba( 29,42,77,0.70)0%,rgba(0,0,0,.3) 70%); background-image: -moz-linear-gradient( 90deg,rgba( 29,42,77,0.70)0%,rgba(0,0,0,.3) 70%); background-image: -ms-linear-gradient( 90deg,rgba( 29,42,77,0.70)0%,rgba(0,0,0,.3) 70%);
}
.featured-imagebox-services.style1:hover .featured-thumbnail:before { opacity: 1; backface-visibility: visible;
}
.featured-imagebox-services.style1 .featured-thumbnail img { width: calc(100% + 10px); max-width: none; height: 400px; opacity: 0; backface-backface-visibility: hidden; -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;
}
.featured-imagebox-services.style1:hover .featured-thumbnail img { opacity: 1; backface-backface-visibility: visible; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px);
}
.featured-imagebox-services.style1 .featured-content { padding: 50px 40px 50px 40px; background-color: #fff; position: absolute; z-index: 2; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; justify-content: center; transition: all 0.6s ease 0s;
}
.featured-imagebox-services.style1:hover .featured-content { background-color: transparent; display: block;
}
.featured-imagebox-services.style1 .featured-content,
.featured-imagebox-services.style1 .featured-content .featured-title,
.featured-imagebox-services.style1 .featured-content .featured-title h3,
.featured-imagebox-services.style1 .featured-content .featured-desc p,
.featured-imagebox-services.style1 .featured-content .ttm-btn { transition: all 0.6s ease 0s;
}
.featured-imagebox-services.style1:hover .featured-content .featured-title h3,
.featured-imagebox-services.style1:hover .featured-content .featured-desc p,
.featured-imagebox-services.style1:hover .featured-content .ttm-btn { transform: translateY(45px); color: #fff;
}
.featured-imagebox-services.style1 .featured-content .featured-title { padding-top: 30px; }
.featured-imagebox-services.style1:hover .featured-content a { color: #fff; }
.featured-imagebox-services.style1 .featured-content .featured-icon .ttm-icon { position: relative; text-align: center; width: 103px; height: 103px; line-height: 111px; margin-bottom: 0;
}
.featured-imagebox-services.style1:hover .featured-content .featured-icon { display: none;
}
.featured-imagebox-services.style1 .featured-content .featured-icon .ttm-icon i { font-size: 45px; }
.featured-imagebox-services.style1 .featured-content .featured-icon .ttm-icon:before { position: absolute; content: ""; top: 0; left: -8px; z-index: 1; width: 103px; height: 104px; background-color: #000; display: block; background-color: #13c5dd; -webkit-mask: url(../images/ser-icon-1.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/ser-icon-1.svg); -webkit-mask-size: contain;
}
.featured-imagebox-services.style1 .featured-content .featured-desc p { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
} /* services-02*/
.featured-imagebox-services.style2 { text-align: center; overflow: visible; transition: all .4s; box-shadow: 0 0 10px 0 rgba(0, 43, 92, 0.08);
}
.featured-imagebox-services.style2 .featured-thumbnail { border-radius: 0; }
.featured-imagebox-services.style2 .featured-content{ padding: 30px 30px; text-align: center; background-color: #fff;
}
.featured-imagebox-services.style2 .featured-content .bottom-footer { padding-top: 25px; margin-top: 25px; position: relative; border-top: 1px solid #eee; transition: all .4s;
}
.featured-imagebox-services.style2 .featured-content .bottom-footer:before { position: absolute; content: ''; height: 1px; width: 100%; top: 0; left: 0; right: 0; transform: scaleX(0);
}
.featured-imagebox-services.style2:hover .featured-content .bottom-footer:before { transform: scaleX(1); transform-origin: left; -webkit-transition: .5s all ease; -khtml-transition: .5s all ease; -moz-transition: .5s all ease; -ms-transition: .5s all ease; -o-transition: .5s all ease; transition: .5s all ease;
} /* style1 */
.ttm-portfolio-format-video { position: relative; overflow: hidden; padding-bottom: 100%; padding-top: 0; height: 0;
}
.ttm-portfolio-format-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;
}
.ttm-boxes-spacing-10px .featured-imagebox-portfolio.style1 { margin: 0;
}
.featured-imagebox-portfolio.style1 .ttm-media-link ,
.featured-imagebox-portfolio.style2 .ttm-media-link { position: absolute; top: 0; bottom: 0; left: 0; right: 0; text-align: center; display: flex; flex-direction: row; align-items: center; justify-content: center;
}
.featured-imagebox-portfolio.style1 .ttm-media-link a,
.featured-imagebox-portfolio.style2 .ttm-media-link a { display: inline-block; font-size: 17px; height: 40px; width: 40px; opacity: 0; line-height: 40px; border-radius: 5px; text-align: center; margin: 0 4px; z-index: 1; margin-top: -86px; background-color: #fff; transform: translateX(-12px); -webkit-transition: .5s; transition: .5s;
}
.featured-imagebox-portfolio.style1 .ttm-media-link a i ,
.featured-imagebox-portfolio.style2 .ttm-media-link a i { color: inherit; }
.featured-imagebox-portfolio.style1 .ttm-media-link a.ttm_image,
.featured-imagebox-portfolio.style2 .ttm-media-link a.ttm_image { transform: translate(-30px, -45px);
}
.featured-imagebox-portfolio.style1 .ttm-media-link a.ttm_link,
.featured-imagebox-portfolio.style2 .ttm-media-link a.ttm_link { transform: translate(30px, 45px);
}
.featured-imagebox-portfolio.style1:hover .ttm-media-link a ,
.featured-imagebox-portfolio.style2:hover .ttm-media-link a { opacity: 1; transform: translate(0px);
}
.featured-imagebox-portfolio.style1 .featured-content{ position: absolute; bottom: 0; width: 100%; padding: 15px; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); z-index: 2; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; text-align: center;
}
.featured-imagebox-portfolio.style1:hover .featured-content{ -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%);
}
.featured-imagebox-portfolio.style1 .featured-content .featured-title h3 ,
.featured-imagebox-portfolio.style2 .featured-content .featured-title h3 { margin-bottom: 0;
} .featured-imagebox-portfolio.style2 { margin: 15px 0; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 10px 0px rgba(43, 52, 59, 0.1); transition: all .5s;
}
.featured-imagebox-portfolio.style2 .featured-content { padding: 20px 15px; text-align: center; background-color: #fff;
}
.featured-imagebox-portfolio.style2 .ttm-media-link a { margin-top: 0;
} /* process-box */
.featured-imagebox-procedure .featured-thumbnail { border-radius: 3px;
}
.featured-imagebox-procedure .featured-thumbnail img { width: 100%; }
.featured-imagebox-procedure .featured-content { position: relative; padding: 15px 0 5px; margin: 0 15px; border-radius: 3px; text-align: center; -webkit-transition: all .9s ease 0s; -moz-transition: all .9s ease 0s; -ms-transition: all .9s ease 0s; -o-transition: all .9s ease 0s; transition: all .9s ease 0s; -ms-transform: translate3d(0,0,0); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-backface-visibility: hidden; backface-visibility: hidden;
}
.featured-imagebox-procedure:hover .featured-content { background-color: #fff; border-radius: 3px; -ms-transform: translate3d(0,-39%,0); -webkit-transform: translate3d(0,-39%,0); transform: translate3d(0,-39%,0); -webkit-box-shadow: 0 0 10px 0 rgb(18 31 56 / 10%); -moz-box-shadow: 0 0 10px 0 rgba(18,31,56,.1); box-shadow: 0 0 10px 0 rgb(18 31 56 / 10%);
}
.featured-imagebox-procedure .featured-content:before { position: absolute; content: ''; bottom: 100%; left: 0; height: 2px; width: 100%; z-index: -1; opacity: 0; border-radius: 3px; -webkit-transition: .55s cubic-bezier(.68,1.55,.265,.55); -moz-transition: .55s cubic-bezier(.68,1.55,.265,.55); -ms-transition: .55s cubic-bezier(.68,1.55,.265,.55); -o-transition: .55s cubic-bezier(.68,1.55,.265,.55); transition: .55s cubic-bezier(.68,1.55,.265,.55);
}
.featured-imagebox-procedure:hover .featured-content:before { opacity: 1; bottom: 0; height: 100%;
}
.featured-imagebox-procedure .featured-desc p { font-size: 14px; margin-bottom: 0;
} /* team-1 */
.featured-imagebox-team.style1 { transition: all .4s; margin-bottom: 15px;
}
.featured-imagebox-team.style1 .featured-thumbnail img { -webkit-transition: all 1000ms; -o-transition: all 1000ms; transition: all 1000ms; width: 100%;
}
.featured-imagebox-team.style1:hover .featured-thumbnail img { -webkit-transform: rotate(9deg) scale(1.2,1.2); -o-transform: rotate(9deg) scale(1.2,1.2); transform: rotate(9deg) scale(1.2,1.2);
}
.featured-imagebox-team.style1 .ttm-box-view-overlay:before { background-color: transparent; background-image: -webkit-linear-gradient(90deg,rgba(29,42,77)0%,rgba(0,0,0,.25) 40%); background-image: -moz-linear-gradient(90deg,rgba(29,42,77)0%,rgba(0,0,0,.25) 40%); background-image: -ms-linear-gradient(90deg,rgba(29,42,77)0%,rgba(0,0,0,.25)40%);
}
.featured-imagebox-team.style1 .featured-content { position: absolute; bottom: 40px; left: 0; right: 0; text-align: center; z-index: 2; overflow: hidden; opacity: 0;
}
.featured-imagebox-team.style1:hover .featured-content { opacity: 1; }
.featured-imagebox-team.style1 .featured-content .featured-title { overflow: hidden;
}
.featured-imagebox-team.style1 .featured-content .featured-title h5 { margin-bottom: 2px; transform: translateY(100%); transition: all 0.7s linear;
}
.featured-imagebox-team.style1 .featured-content .team-position { font-size: 15px; margin-bottom: 0; transform: translateY(100%); transition: all 0.9s linear;
}
.featured-imagebox-team.style1:hover .featured-content .featured-title h5,
.featured-imagebox-team.style1:hover .featured-content .team-position { transform: translateY(0);
} /* team-2 */
.featured-imagebox-team.style2 { transition: all .4s; margin-bottom: 15px; overflow: visible;
}
.featured-imagebox-team.style2:hover { box-shadow: 0 0 10px 0 rgba(43, 52, 59, 0.30);
}
.featured-imagebox-team.style2 .featured-thumbnail { border-radius: 0; }
.featured-imagebox-team.style2 .featured-content { position: relative; text-align: left; padding: 24px 40px 25px; background-color: #fff; -webkit-transition: all .35s; transition: all .35s; -webkit-box-shadow: 0 0 8px 0 rgba(29,42,77,.11); -moz-box-shadow: 0 0 8px 0 rgba(29,42,77,.11); box-shadow: 0 0 8px 0 rgba(29,42,77,.11);
}
.featured-imagebox-team.style2 .featured-content:before { content: ''; position: absolute; top: 37px; left: 0; height: 3px; width: 26px; background-color: #13c5dd;
}
.featured-imagebox-team.style2 .featured-content .featured-title h5 { margin-bottom: 0;
}
.featured-imagebox-team.style2 .featured-content .team-position { font-size: 14px; margin-bottom: 0;
}
.featured-imagebox-team.style2 .media-block { position: absolute; right: 20px; top: 30px;
}
.featured-imagebox-team.style2 .media-block a.media-btn i { position: relative; font-size: 12px; text-align: center; z-index: 2; width: 30px; font-weight: 500; height: 30px; line-height: 30px; cursor: pointer; display: block; background-color: #13c5dd; color: #fff; border-radius: 50%; -webkit-transition: color .3s,background .3s ease,-webkit-transform .2s; transition: color .3s,background .3s ease,-webkit-transform .2s; -o-transition: color .3s,background .3s ease,-o-transform .2s; -moz-transition: transform .2s,color .3s,background .3s ease,-moz-transform .2s; transition: transform .2s,color .3s,background .3s ease; transition: transform .2s,color .3s,background .3s ease,-webkit-transform .2s,-moz-transform .2s,-o-transform .2s;
}
.featured-imagebox-team.style2 .media-block a.media-btn:hover i { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);
}
.featured-imagebox-team.style2 .media-block .social-icons { z-index: 1; bottom: 0; position: absolute; right: 0; top: auto; opacity: 0; z-index: 9; -webkit-transition: 0.8s; -ms-transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s; transition: .8s; margin: 0;
}
.featured-imagebox-team.style2 .media-block:hover .social-icons{ opacity: 1; bottom: 45px;
}
.featured-imagebox-team.style2 .media-block .social-icons li{ margin: 3px 0; width: 100%;
}
.featured-imagebox-team.style2 .media-block .social-icons li a{ height: 30px; width: 30px; line-height: 30px; font-size: 14px; text-align: center; background-color: #eff3ff; border-radius: 50%; display: block; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
} /* team-3 */
.featured-imagebox-team.style3,
.featured-imagebox-team.style3 .featured-thumbnail { border-radius: 0; }
.featured-imagebox-team.style3 .ttm-media-link a { position: absolute; top: 41%; left: 0; right: 0; margin: 0 auto; margin-top: -1px; color: rgb(255, 255, 255); width: 35px; height: 35px; text-align: center; line-height: 35px; font-size: 13px; font-weight: 500; opacity: 0; z-index: 1; border-radius: 3px; -webkit-transition: all .9s ease; -o-transition: all .9s ease; -moz-transition: all .9s ease; transition: all .9s ease; transform: scale(0); -webkit-transform: scale(0);
}
.featured-imagebox-team.style3:hover .ttm-media-link a{ opacity: 1; transform: scale(1); -webkit-transform: scale(1);
} /* =============================================== 13.Progress-Bar
------------------------*/
.ttm-progress-bar{ position: relative; }
.ttm-progress-bar:not(:last-child){ margin-bottom: 35px; }
.ttm-progress-bar .progressbar-title { font-size: 16px; line-height: 24px; margin-bottom: 13px; font-weight: 600; padding-right: 50px; text-transform: capitalize;
}
.ttm-progress-bar .progress-bar-percent { position: absolute; right: 0; z-index: 3; font-weight: 600; text-shadow: none; font-size: 13px; line-height: 15px; border-radius: 0; top: -40px; padding: 4px 7px;
}
.ttm-progress-bar .progress-bar-percent:before { content: ''; position: absolute; width: 0; height: 0; border-top: 10px solid; border-left: 10px solid rgba(255,255,255,0); right: 0; top: 22px;
}
.ttm-progress-bar .progress-bar { display: block; height: 7px; position: relative; background-color: rgba(192, 192, 192, 0.34);
}
.ttm-progress-bar .progress-bar-inner{ box-shadow: none; height: 7px; width: 100%; z-index: 1; background-color: rgba(192, 192, 192, 0.34);
}
.ttm-bgcolor-skincolor .ttm-progress-bar .progress-bar-inner{ background-color: rgba(0, 0, 0, 0.1);
}
.ttm-bgcolor-darkgrey .ttm-progress-bar .progress-bar-inner { background-color: rgba(255,255,255,.1); }
.ttm-bgcolor-grey .ttm-progress-bar .progress-bar-inner{ background-color: #fff;} /* =============================================== 14.Testimonial
------------------------*/
.testimonials { position: relative;
}
.testimonials .testimonial-caption h3 { font-size: 18px; line-height: 18px; display: block; font-weight: 600; margin-bottom: 0;
}
.testimonial-caption label { display: block; margin: 0; font-size: 13px; line-height: 26px; margin-bottom: 4px;
}
.testimonials .testimonial-content blockquote{ padding: 10px 25px; font-size: 20px; position: relative; line-height: 32px; font-style: italic; margin: 0;
}
.testimonials .testimonial-img img { width: 90px; height: 90px;
}
.star-ratings ul{ padding: 0; margin: 0;}
.star-ratings li{ font-size: 14px; min-width: 14px; display: inline-block; color: #e0e8f0;
}
.star-ratings ul li.active , .star-ratings ul li.active i{ color: #ffba00;} /* ttm-testimonial-box-view-style1 */
.ttm-testimonial-box-view-style1 { padding: 15px 15px;
}
.testimonials.ttm-testimonial-box-view-style1 .testimonial-caption, .testimonials.ttm-testimonial-box-view-style1 .testimonial-avatar,
.testimonials.ttm-testimonial-box-view-style2 .testimonial-caption, .testimonials.ttm-testimonial-box-view-style2 .testimonial-avatar { display: table-cell; vertical-align: middle;
}
.testimonials.ttm-testimonial-box-view-style1 .testimonial-caption,
.testimonials.ttm-testimonial-box-view-style2 .testimonial-caption { padding-left: 20px;
}
.testimonials.ttm-testimonial-box-view-style1 .testimonial-content blockquote { text-align: left; font-size: 18px; line-height: 29px; font-weight: 400; padding: 0; position: relative; margin: 0 0 35px; padding-top: 77px; border-left: none; font-style: italic; background-color: transparent;
}
.testimonials.ttm-testimonial-box-view-style1 .testimonial-content blockquote:before { content: ""; position: absolute; top: 0; left: 0; height: 50px; width: 60px; background-color: #fff; text-align: center; display: block; -webkit-mask: url(../images/quote-1.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/quote-1.svg); -webkit-mask-size: contain;
}
.testimonials.ttm-testimonial-box-view-style1 .testimonial-img img { width: 90px; height: 90px;
} /* ttm-testimonial-box-view-style2 */
.ttm-testimonial-box-view-style2 { position: relative; border-radius: 10px; background-color: #fff; padding: 25px 34px 30px 34px; margin-top: 15px; margin-bottom: 5px; overflow: visible; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-box-shadow: 0 0 8px 0 rgba(29,42,77,.11); -moz-box-shadow: 0 0 8px 0 rgba(29,42,77,.11); box-shadow: 0 0 8px 0 rgba(29,42,77,.11);
}
.ttm-testimonial-box-view-style2:hover { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px);
}
.ttm-testimonial-box-view-style2:after { position: absolute; content: ''; height: 53px; width: 40px; right: 20px; bottom: 20px; z-index: 2; background-color: #000; -webkit-mask: url(../images/shape-1.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/shape-1.svg); -webkit-mask-size: contain; display: block; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s;
}
.testimonials.ttm-testimonial-box-view-style2 .testimonial-content blockquote { text-align: left; font-size: 17px; line-height: 30px; font-weight: 300; position: relative; padding: 0; margin: 0 0 20px;
}
.testimonials.ttm-testimonial-box-view-style2 .testimonial-content blockquote:before { position: absolute; content: ""; right: 50px; bottom: -40px; height: 53px; width: 61px; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; -webkit-mask: url(../images/quote-3.svg) no-repeat 100% 100%; -webkit-mask-box-image: url(../images/quote-3.svg); -webkit-mask-size: contain; opacity: 0.08;
}
.testimonials.ttm-testimonial-box-view-style2:hover .testimonial-content blockquote:before { opacity: 1; }
.testimonials.ttm-testimonial-box-view-style2 .testimonial-img img { border-radius: 50%; height: 70px; width: 70px;
} /* =============================================== 15.Client-row ------------------------*/
.client-box{ position: relative; text-align: center;
}
.client-box .ttm-client-logo-tooltip{ margin-top: 45px; margin-bottom: 45px; overflow: hidden;
}
.client-box .ttm-client-logo-tooltip,
.client-box .ttm-client-logo-tooltip-inner{ position: relative; }
.client-box .ttm-client-logo-tooltip img{ text-align: center; display: block; margin: 0 auto; width: 140px; height: 80px;
}
.client-box:hover .ttm-client-logo-tooltip img { opacity: 1; } .client-box .ttm-client-logo-tooltip .client-thumbnail_hover,
.client-box .ttm-client-logo-tooltip .client-thumbnail { -webkit-transition: -webkit-transform .4s ease; transition: -webkit-transform .4s ease; -o-transition: transform .4s ease; transition: transform .4s ease;
}
.client-box .ttm-client-logo-tooltip .client-thumbnail_hover{ transform: translateY(-100%); position: absolute; z-index: 1; top: 0; left: 0; right: 0;
}
.client-box:hover .ttm-client-logo-tooltip .client-thumbnail_hover { visibility: visible; transform: translateY(0%);
}
.client-box:hover .ttm-client-logo-tooltip .client-thumbnail { transform: translateY(100%);
}
.client-box .ttm-client-logo-tooltip .client-thumbnail_hover img { filter: grayscale(100%); -webkit-filter: grayscale(100%); opacity: .4; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;
} /* =============================================== 16.Accordion
------------------------*/
.wrap-acadion .accordion { margin-top: 15px; }
.accordion .toggle:not(:last-child){ border-bottom: 1px solid #eaeaea; margin-bottom: 15px; padding-bottom: 15px;
}
.accordion .toggle-title a{ display: block; font-weight: 600; font-size: 18px; position: relative;
}
.accordion .toggle-title a i{ margin-right: 15px; }
.accordion .toggle-content { margin-top: 15px;
}
.accordion .toggle-content.show { display: block !important;
}
.accordion .toggle-content p:last-child { margin-bottom: 0;
}
.accordion .toggle .toggle-title a:after { position: absolute; font-family: "FontAwesome"; right: 20px; top: 5px; display: inline-block; content: "\f055"; border-radius: 50%; font-size: 20px; line-height: 10px;
}
.accordion .toggle .toggle-title a.active:after { content: "\f056";
}
.accordion .alignleft{ margin: .15em 1.5em 1.1em 0; } .accordion .toggle.ttm-control-left-true .toggle-title a{ padding-left: 40px;
}
.accordion .toggle.ttm-control-left-true .toggle-title a:after{ left: 20px;
} .accordion .toggle.ttm-control-left-true .toggle-title a { padding-left: 30px; }
.accordion .toggle.ttm-control-left-true .toggle-title a:after{ left: 0; border: 0; font-size: 10px; height: 18px; width: 18px; line-height: 18px; text-align: center;
} /* ttm-style-classic */
.accordion .toggle.ttm-toggle_style_classic { padding-bottom: 0px; margin-bottom: 20px; border: 0; position: relative; clear: both;
}
.accordion .toggle.ttm-toggle_style_classic:last-child{ margin-bottom: 0; }
.accordion .toggle.ttm-toggle_style_classic .toggle-content{ padding: 20px 20px 0; margin-top: 0;
}
.accordion .toggle.ttm-toggle_style_classic .toggle-title a { text-transform: capitalize; font-size: 16px; line-height: 24px; font-weight: 600; display: block; border-radius: 6px; padding: 12px 20px 12px; padding-right: 48px; position: relative; -webkit-transition: color 0s ease-in-out; -o-transition: color 0s ease-in-out; transition: color 0s ease-in-out;
}
.accordion .toggle.ttm-toggle_style_classic.ttm-control-left-true .toggle-title a{ padding-right: 20px; padding-left: 48px;
}
.accordion .toggle.ttm-toggle_style_classic.ttm-control-left-true .toggle-title a:after{ left: 20px;
}
.accordion .toggle.ttm-toggle_style_classic .toggle-title a:after{ top: 30%; font-size: 20px; line-height: 1;
} .accordion .toggle.ttm-toggle_style_classic.style2 { margin-bottom: 10px; }
.accordion .toggle.ttm-toggle_style_classic.style2 .toggle-content { padding-bottom: 10px; padding-top: 15px;
}
.accordion .toggle.ttm-toggle_style_classic.style2 .toggle-title a { font-size: 17px; font-weight: 400; border: 1px solid rgba(0,0,0,.02);
}
.accordion .toggle.style2 .toggle-title a:after{ content: "\f107"; font-weight: bold; font-size: 18px;
}
.accordion .toggle.style2 .toggle-title a.active:after { content: "\f106";
} /* =============================================== 17.Wrap-Form
------------------------*/
.wrap-form label{ width: 100%; margin: 0;
}
.wrap-form span.text-input { margin-bottom: 20px; display: block; position: relative;
}
.wrap-form span.text-input > i { position: absolute; left: 10px; top: 21px; opacity: .9; font-size: 14px; z-index: 1;
} /* contactform */
.wrap-form.contact_form span.text-input i { position: absolute; left: 0; top: 20px; opacity: .9; font-size: 16px; z-index: 1;
}
.wrap-form.contact_form span.text-input input, .wrap-form.contact_form span.text-input textarea,
.wrap-form.contact_form span.text-input select { border-radius: 0; color: rgba(0,0,0,.60); border-color: #f1f1f1; border-radius: 5px; padding: 12px 15px;
}
.wrap-form.contact_form span.text-input textarea { padding: 10px 15px; }
.wrap-form.contact_form button[type="submit"] { font-size: 13px; padding: 14px 28px; border-radius: 3px;
}
.ttm-bgcolor-grey .wrap-form.contact_form span.text-input input, .ttm-bgcolor-grey .wrap-form.contact_form span.text-input textarea,
.ttm-bgcolor-grey .wrap-form.contact_form span.text-input select{ background-color: #fff;
} .ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input input, .ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input textarea,
.ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input select{ background-color: transparent; border: 0; color: #fff; padding-left: 0; border-bottom: 2px solid rgba(255,255,255,.12);
}
.ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input input::-webkit-input-placeholder, .ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input textarea::-webkit-input-placeholder,
.ttm-bgcolor-skincolor .wrap-form.contact_form span.text-input select::-webkit-input-placeholder { color: #fff;
} .wrap-form.request_qoute_form span.text-input { margin: 5px 0 25px; }
.wrap-form.request_qoute_form label { width: auto; }
.wrap-form.request_qoute_form span.text-input input,
.wrap-form.request_qoute_form span.text-input textarea,
.wrap-form.request_qoute_form span.text-input select { border-radius: 5px; border: 0;
} /* =============================================== 18.Tab
------------------------*/
.ttm-tabs ul.tabs{ width:100%; padding: 0; margin: 0;
}
.ttm-tabs ul.tabs li{ position: relative; display: inline-block;
}
.ttm-tabs ul.tabs li:last-child{ margin-bottom: 0;
}
.ttm-tabs .content-tab .content-inner { display: none;
}
.ttm-tabs .content-tab .content-inner.active { display: block;
} /* ttm-tab-style-01 */
.ttm-tabs.ttm-tab-style-01 ul.tabs { margin: 30px 0 0; display: flex; width: 100%; position: relative; justify-content: center; align-items: center; text-align: center;
}
.ttm-tabs.ttm-tab-style-01 ul.tabs:before { position: absolute; content: ''; top: -15px; left: 25%; height: 1px; width: 50%; background-color: rgba(0,0,0,.06);
}
.ttm-tabs.ttm-tab-style-01 ul.tabs li a{ display: block; cursor: pointer; padding: 10px 25px; margin-bottom: 5px; line-height: 22px; width: auto; position: relative; z-index: 3; -webkit-transition: all 0.3s; transition: all 0.3s; background-color: #fff; font-size: 14px; font-weight: 700; border-radius: 3px; text-transform: uppercase; background-color: transparent; padding: 12px 30px 12px;
}
.ttm-tabs.ttm-tab-style-01 ul.tabs li a:after { content: ''; position: absolute; height: 3px; width: 100%; background-color: #000; bottom: -4px; left: 0; opacity: 0; transform: scale(0); -webkit-transition: all 0.5s; transition: all 0.5s;
}
.ttm-tabs.ttm-tab-style-01 ul.tabs li a:hover:after, .ttm-tabs.ttm-tab-style-01 ul.tabs li.active a:after { opacity: 1; transform: scale(1);
}
.ttm-tabs.ttm-tab-style-01 .content-inner h3 { font-size: 32px; line-height: 40px;
}
.ttm-tabs.ttm-tab-style-01 .content-tab { padding: 15px 30px; background: #fff;
} /* ttm-tab-style-02 */
.ttm-tabs.ttm-tab-style-02 ul.tabs { display: flex; width: 100%; position: relative; justify-content: center; align-items: center; text-align: center; padding: 15px 15px 0;
}
.ttm-tabs.ttm-tab-style-02 ul.tabs li { -webkit-flex: 1 1 auto; flex: 1 1 auto; text-align: center;
}
.ttm-tabs.ttm-tab-style-02 ul.tabs li a { display: block; cursor: pointer; margin-bottom: 10px; line-height: 22px; width: auto; position: relative; z-index: 3; -webkit-transition: all 0.3s; transition: all 0.3s; color: #fff; font-size: 18px; font-weight: 600; padding: 14px 18px 14px 18px;
}
.ttm-tabs.ttm-tab-style-02 .content-tab { padding: 15px 15px;
}
.ttm-tabs.ttm-tab-style-02 .content-tab p:last-child { margin-bottom: 0; } /* =============================================== 19.Boxes-Spacing
------------------------*/
.row.ttm-boxes-spacing-30px, .ttm-boxes-spacing-30px { margin: 0 -20px; }
.ttm-boxes-spacing-30px .ttm-box-col-wrapper { padding-right: 15px; padding-left: 15px; padding-bottom: 30px;
}
.row.ttm-boxes-spacing-20px, .ttm-boxes-spacing-20px { margin: 0 -15px; }
.ttm-boxes-spacing-20px .ttm-box-col-wrapper { padding-right: 10px; padding-left: 10px; padding-bottom: 20px;
}
.row.ttm-boxes-spacing-15px, .ttm-boxes-spacing-15px { margin: 0 -10px; }
.ttm-boxes-spacing-15px .ttm-box-col-wrapper { padding-right: 7.5px; padding-left: 7.5px; padding-bottom: 15px;
}
.row.ttm-boxes-spacing-10px, .ttm-boxes-spacing-10px{ margin: 0 -5px; }
.ttm-boxes-spacing-10px .ttm-box-col-wrapper { padding-right: 5px; padding-left: 5px; padding-bottom: 10px;
}
.row.ttm-boxes-spacing-5px, .ttm-boxes-spacing-5px{ margin: 0; }
.ttm-boxes-spacing-5px .ttm-box-col-wrapper { padding-right: 2.5px; padding-left: 2.5px; padding-bottom: 5px;
}
.row.ttm-boxes-spacing-0px, .ttm-boxes-spacing-0px{ margin: 0; }
.ttm-boxes-spacing-0px .ttm-box-col-wrapper { padding-right: 0px; padding-left: 0px; margin-bottom: 0px; outline: 0;
} /* =============================================== 15.Pricing-Plan
------------------------*/
.ttm-pricing-plan { position: relative; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; overflow: hidden; background-color: #fff; padding: 40px 30px 50px; margin: 15px 0; text-align: center; -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); -moz-box-shadow: 0 0 12px 0 rgba(0,0,0,.1); box-shadow: 0 0 10px 0 rgb(43 52 59 / 10%); border-radius: 6px; border-top: 4px solid;
}
.ttm-pricing-plan:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px);
}
.ttm-p_table-title h3 { font-size: 20px; line-height: 30px; margin-bottom: 15px; font-weight: 600;
}
.ttm-p_table-icon .ttm-icon { margin-bottom: 0; }
.ttm-p_table-icon .ttm-icon i { display: inline-block; font-size: 58px;
}
.ttm-p_table-amount { margin-top: 15px;
}
.ttm-p_table-amount h3 { font-size: 40px; line-height: 50px; margin-bottom: 0; font-weight: 700;
}
.ttm-p_table-amount .cur_symbol { font-size: 26px; font-weight: 600; color: #333333; padding: 0 2px;
}
.ttm-p_table-amount .pac_frequency { position: relative; font-size: 15px; line-height: 25px; font-weight: 500; display: block;
}
.ttm-p_table-body { transition: all 0.5s ease; position: relative;
}
.ttm-p_table-features { list-style-type: none; position: relative; margin: 0; padding: 15px 30px 15px; margin: 0 -30px;
}
.ttm-p_table-features li { padding: 0; margin: 0; font-size: 15px; padding-top: 12px; padding-bottom: 11px; border-bottom: 1px solid #f2f2f2;
}
.ttm-p_table-features li:last-child { border-bottom: 0; padding-bottom: 0;
}
.ttm-p_table-footer{ text-align: center; padding-top: 20px; transition: all 0.5s ease;
} /* =============================================== 21.Sidebar
------------------------*/
.sidebar .widget-area .widget { position: relative; margin: 0 0 35px; background-color: #fff; border-radius: 5px;
}
.sidebar .widget-area .widget:after { display: block; height: 3px; content: ''; position: absolute; width: auto; bottom: 0; left: 35px; right: 35px; z-index: 1;
}
.sidebar .widget-area .widget.with-title{ padding: 30px 35px;
}
.sidebar .widget-area .widget:last-child{ margin-bottom: 0px; }
.sidebar .widget ul{ margin: 0; padding: 0;
}
.sidebar .widget ul >li { border-top: 1px solid #eee; padding-bottom: 6px; padding-top: 5px; list-style: none;
}
.sidebar .widget ul>li:first-child{ border-top: none; padding-top: 0;
}
.sidebar .sep_holder .sep_line{ border-color: #ebebeb; }
.sidebar .widget-title{ font-size: 20px; line-height: 25px; margin-bottom: 20px; position: relative;
} /*widget-search*/
.sidebar .widget.widget-search ,
.sidebar .widget-area.ttm-col-bgcolor-yes .widget.widget-search { padding: 0;
}
.sidebar .widget.widget-search .search-form{ border: 0; position: relative;
}
.sidebar .widget.widget-search .search-form label { display: block; margin: 0;
}
.sidebar .widget-search .screen-reader-text { clip: rect(1px,1px,1px,1px); position: absolute!important; height: 1px; width: 1px; overflow: hidden;
}
.sidebar .widget.widget-search .search-form .btn[type="submit"] { content: ""; position: absolute; top: 0; right: 0; padding: 0; width: 50px; height: 50px; line-height: 0; z-index: 1; outline: 0; border: 0;
}
.sidebar .widget.widget-search .input-text { border: 1px solid #f0f0f0; padding: 11px 15px; background-color: #fff;
}
.sidebar .widget.widget-search input{ color: #242c42;
} /* contact-widget */
ul.contact-widget-wrapper { padding: 20px 15px !important; }
ul.contact-widget-wrapper li{ border: 0 !important; padding-top: 0 !important; padding-bottom: 16px !important;
}
ul.contact-widget-wrapper li:last-child { padding-bottom: 0 !important;
}
ul.contact-widget-wrapper li i { position: absolute; top: 3px; left: 0; font-size: 17px;
}
ul.contact-widget-wrapper li { padding-left: 30px ; position: relative; padding-top: 0; font-size: 14px; padding-bottom: 17px; line-height: 23px;
} /* widget-banner */
.widget-banner .ttm-bgcolor-darkgrey > .ttm-bg-layer, .widget-banner .ttm-col-wrapper-bg-layer-inner { background: linear-gradient(to bottom,rgb(17 24 39) 70%,rgb(10 15 27) 0%); background-color: transparent !important;
}
.widget-banner .ttm-horizontal_sep { border-top-color: rgba(255,255,255,0.12);
}
.widget-banner { padding: 0 !important; }
.widget-banner > div { padding: 30px 30px 50px; border-radius: 5px; overflow: hidden;
}
.widget-banner .ttm-icon i { font-size: 85px; line-height: 1; }
.widget-banner h3 { font-size: 20px; line-height: 1.2; font-weight: 600;
}
.widget-banner ul li { padding: 0 0 15px !important; font-size: 22px; line-height: 1.2; font-weight: 600; border: 0 !important; color: #fff;
}
.widget-banner ul li:last-child { font-size: 14px; margin-bottom: 25px; font-weight: normal;
} /** images-gellary **/
.widget .images-gellary ul { display: inline-table; margin: 0 -1.1666667% -1.1666667% ;
}
.widget .images-gellary ul li { display: inline-block; max-width: 33.21%; border: 0; float: left; padding: 3px !important; text-align: center; vertical-align: top; width: 100%;
}
.widget .images-gellary a { width: 85px; } /* widget-categories */
.widget-categories ul li a{ position: relative; display: inline-block; padding-left: 20px; line-height: 1; color: inherit;
}
.widget-categories ul li{ padding: 0 0 24px 0 !important; border: 0 !important; position: relative; line-height: 1;
}
.widget-categories ul li:last-child { padding-bottom: 0 !important;
}
.widget-categories ul li a:before { position: absolute; content: "\e61a"; font-family: "themify"; top: 3px; font-weight: bold; left: 0; font-size: 9px; line-height: 1;
} /* widget-nav-menu */
.widget.widget-nav-menu:after { content: unset !important;
}
.widget.widget-nav-menu { -webkit-box-shadow: 0 0 10px 0 rgb(18 31 56 / 10%); -moz-box-shadow: 0 0 10px 0 rgba(18,31,56,.1); box-shadow: 0 0 10px 0 rgb(18 31 56 / 10%); border: none!important; padding: 12px!important;
}
.widget.widget-nav-menu ul li{ padding: 10px 0 0; border: 0; position: relative;
}
.widget.widget-nav-menu ul li a{ display: block; padding: 17px 20px 17px 40px; position: relative; z-index: 1; border: 1px solid #e3e3e3; border-radius: 3px; font-size: 16px; font-weight: 600; background-color: #fff;
}
.widget.widget-nav-menu ul li a:hover { padding-left: 20px;
}
.widget.widget-nav-menu ul li a:before { position: absolute; content: " "; display: inline-block; width: 0; height: 100%; top: 0; left: 0; -webkit-transition: width 0.5s linear; transition: width 0.5s linear; z-index: -1; border-radius: 3px;
}
.widget.widget-nav-menu ul li:hover a:before, .widget.widget-nav-menu ul li.active a:before { width: 100%;
}
.widget.widget-nav-menu ul li a:after { content: "\f063"; font-family: "fontawesome"; font-style: normal; font-weight: 700; position: absolute; top: 18px; left: 20px; font-size: 13px; opacity: .4; background-color: transparent; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s;
}
.widget.widget-nav-menu ul li:hover a:after, .widget.widget-nav-menu ul li.active a:after { left: auto; right: 20px; content: "\f061"; opacity: 1;
} /** ttm-recent-post-list **/
.widget ul.ttm-recent-post-list>li { padding: 0 0 14px 0; border-top: 0;
}
.widget ul.ttm-recent-post-list>li:last-child{ padding-bottom: 0;
}
.widget ul.ttm-recent-post-list>li> .post-detail a { line-height: 21px; font-size: 14px; display: block; position: relative; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
}
.widget ul.ttm-recent-post-list>li img { display: block; width: 90px; height: 90px; float: left; margin-right: 18px;
}
.widget ul.ttm-recent-post-list>li .post-date { display: block; font-size: 13px; margin-bottom: 2px;
}
.widget ul.ttm-recent-post-list>li .post-date i { margin-right: 6px; font-size: 11px;
}
.widget ul.ttm-recent-post-list li:after { content: " "; display: table; clear: both;
} /* tagcloud */
.widget .tagcloud a { display: inline-block; padding: 7px 21px; margin: 0 8px 10px 0; border: 1px solid #e3e3e3; border-radius: 5px; font-size: 14px!important; background-color: #fff; font-weight: 400; color: inherit;
}
.widget .tagcloud a:nth-last-child(-n+2) { margin-bottom: 5px;
} /* pagination */
.pagination-block { display: block; margin-top: 35px; text-align: center;
}
.pagination-block .page-numbers { width: 35px; height: 35px; line-height: 35px; text-align: center; display: inline-block; color: #656c76; font-size: 15px; font-weight: 600; border: 1px solid #e9eef6; border-radius: 0; margin: 0 3px; padding: 0; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;
}
.pagination-block .page-numbers i{ font-size: 12px; } /*** Color Switcher Style
==================================================================== ***/
.prt_floting_customsett { position: fixed; top: 50%; right: 0; padding: 3px 0 10px; margin: -89px 0 0; background-color: #fff; box-shadow: 0 6px 12px rgb(0 0 0 / 25%); z-index: 99999;
}
.tmtheme_fbar_icons { display: block; position: relative; width: 55px; height: 45px; line-height: 52px; text-align: center;
}
.tmtheme_fbar_icons i { display: inline-block; vertical-align: middle; transition: .3s; font-size: 21px; color: #232323;
}
.tmtheme_fbar_icons > span { display: block; position: absolute; right: 100%; top: 0; background-color: #fff; box-shadow: 0 6px 12px rgb(0 0 0 / 25%); opacity: 0; visibility: hidden; font-size: 16px; color: #232323; transform: translateX(-5px); transition: 0.5s ease; padding: 0 20px;
}
.tmtheme_fbar_icons > span >span { padding-left: 5px;
}
.tmtheme_fbar_icons > span:after { content: ''; position: absolute; top: -2px; bottom: -10px; right: -15px; width: 15px; background-color: #fff; height: 55px;
}
.tmtheme_fbar_icons:hover > span { opacity: 1; visibility: visible; transform: translateX(0);
} .tm-desctext { position: absolute; top: 30px; background-color: #fff; max-width: 400px; right: 30px; padding: 30px 50px 23px 30px; text-align: left;
}
.tm-desctext:before { display: block; content: ""; position: absolute; width: 6px; height: 100%; left: 0; top: 0; background-color: #00dab2;
}
.tm-iocnbox-btn { font-size: 18px; line-height: 26px; margin-top: 15px;
}