/*------------------------------------------------------------------------------------------------------------- ------------- TARİH : 15.02.2020 TASARIM : - E-POSTA : bilgi@teknomic.com.tr WEBSİTE : www.teknomic.com.tr ------------- -------------------------------------------------------------------------------------------------------------*/ /* TABLE BUILD 01. FONT 02. GENERAL A. TL ICON B. PAGE-TITLE C. BUTTONS D. GALLERY E. ACCENT-TEXT F. TEXT/ BACKGROUND COLOR G. LIGHTBOX H. ARTICLE MARK I. DIVIDER-LINE J. BOX/ED K. TOOLTIPS L. MARGIN-PADDING M. ACCORDION N. GENERAL ALL/MORE O. MESSAGES/IMPORT/WARNING/SUCCESS P. PAGINATION R. HORIZONTAL/ VERTICAL TABS S. TABLES U. PROGRESS BAR V. 404 ERROR Y. Z. 03. HEADER A. TOP HEADER B. TOP HEADER INFO C. MENU + LOGO D. E. 04. MAIN CONTAINER A. SLIDER B. SERVICES LIST C. COUNTER D. DATA RECOVERY E. REFERENCE F. IMPORTANT DATES G. RANDOM COMMENTS H. I. 05. CONTAINER A. MORE TITLE B. SIDEBAR C. MORE TOOLS D. DOWNLOAD FILES E. NEWS COMMENT F. ABOUT G. PAGE CONTACT H. MEDIA I. MEDIA MORE J. PRODUCT CATEGORY K. L. M. N. O. 06. FOOTER A. FOOT BOX CONTACT B. SOCIAL MEDIA C. WORKING HOURS D. FOOTER TITLE E. SITE CONTACT F. LIST G. NEWSLETTER H. COPYRIGHT I. SCROLL UP J. K. 07. RESPONSIVE A. 100X420 B. 420X768 C. 768X992 D. 992X1199 E. PRINT F. 08. ANIMATION A. SCROLL B. C. D. E. */ /* beklettt .sys-header--home .sys-header__link { color: white; font-family: "Real Text Pro", "Segoe UI", Arial, sans-serif; font-size: 16px; font-weight: 500; letter-spacing: -0.4px; line-height: 16px; background-image: linear-gradient(to right, #4AD7D1, #4AD7D1 50%, white 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; transition: background-position 0.5s; } .sys-header--home .sys-header__link:hover { text-decoration: none; background-position: 0%; } Detaylı bilgi için tıklayınız.! */ /* =============================================== 01. FONT ====================================================== */ @import "tm-reset.css"; @import "tm-myfonts.css"; /* =============================================== 01. FONT ====================================================== */ /* =============================================== 02. GENERAL =================================================== */ body { font: 400 14px/22px "tm-r",sans-serif; color: #575a61; margin:0; padding:0; } a { -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -ms-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } a, a:hover, a:active, a:focus { color:rgba(23,186,96, 0.8); text-decoration: none; outline: none; } ::selection{ background:#17ba60 none repeat scroll 0 0; color:#fff; } ::-moz-selection{ background:#17ba60 none repeat scroll 0 0; color:#fff; } ::-webkit-selection{ background:#17ba60 none repeat scroll 0 0; color:#fff; } /* ----------------------------------------------- A. TL ICON ---------------------------------------------------- */ .TL-icon{ font-style:normal;} .TL-icon:before{ font-family:"tlfont", sans-serif; /*font-size:18px;*/ font-style:normal; content:"t"; padding:0 3px 0 0; } /* ----------------------------------------------- A. TL ICON ---------------------------------------------------- */ /* ----------------------------------------------- B. PAGE-TITLE ------------------------------------------------- */ .page-title { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; position: relative; z-index: 10; } .page-title h3 { font: 600 26px/34px "tm-sb",sans-serif; color: #020307; text-align:center; margin:25px 0; padding: 0 0 10px; position: relative; } .page-title h3::after { border-bottom: 1px solid rgba(87,90,97,.4); bottom: 2px; margin-left: -15px; width: 30px; } .page-title h3::before { border-top: 1px solid rgba(87,90,97,.4); bottom: 6px; margin-left: -25px; width: 50px; } .page-title h3:hover::before {width: 85px;margin-left: -40px;border-color:#17ba06;} .page-title h3:hover::after {width: 65px;margin-left: -30px;border-color:#17ba06;} .page-title h3::after, .page-title h3::before { background: rgba(87,90,97,.6) none repeat scroll 0 0; content: ""; display: block; left: 50%; position: absolute; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .page-title h3 a{ color:#020307;} .page-title h3 a:hover{ color:rgba(23,186,96, 1);} /* ----------------------------------------------- B. PAGE-TITLE ------------------------------------------------- */ /* ----------------------------------------------- C. BUTTONS ---------------------------------------------------- */ a.tm-animated-button, a.tm-animated-button:visited { font: 700 13px/22px 'tm-b',sans-serif; color: #020307; text-align: center; text-decoration: none; position: relative; z-index:0; display: block; /*margin: 7px auto;*/ margin: 0; padding: 10px 15px; overflow: hidden; border-radius: 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } a.tm-animated-button:after, a.tm-animated-button:visited:after { content: ""; position: absolute; height: 0%; left: 50%; top: 50%; width: 150%; z-index: -1; -webkit-transition: all 0.75s ease 0s; -moz-transition: all 0.75s ease 0s; -o-transition: all 0.75s ease 0s; transition: all 0.75s ease 0s; } a.tm-animated-button i.fa{ margin:0px 5px;} a.tm-animated-button:hover, a.tm-animated-button:visited:hover { color: #fff; text-shadow: none; } a.tm-animated-button:hover:after, a.tm-animated-button:visited:hover:after { height: 500%; } /*---------*/ a.tm-animated-button.iris-one,a.tm-animated-button.iris-one-I, a.tm-animated-button.iris-two,a.tm-animated-button.iris-two-I, a.tm-animated-button.iris-three,a.tm-animated-button.iris-three-I, a.tm-animated-button.iris-four,a.tm-animated-button.iris-four-I, a.tm-animated-button.iris-one-II, a.tm-animated-button.iris-two-II, a.tm-animated-button.iris-three-II, a.tm-animated-button.iris-four-II, a.tm-animated-button.iris-one-III, a.tm-animated-button.iris-two-III, a.tm-animated-button.iris-three-III, a.tm-animated-button.iris-four-III, a.tm-animated-button.hercai-one,a.tm-animated-button.hercai-one-I, a.tm-animated-button.hercai-two,a.tm-animated-button.hercai-two-I, a.tm-animated-button.hercai-three,a.tm-animated-button.hercai-three-I, a.tm-animated-button.hercai-four,a.tm-animated-button.hercai-four-I, a.tm-animated-button.hercai-one-II, a.tm-animated-button.hercai-two-II, a.tm-animated-button.hercai-three-II, a.tm-animated-button.hercai-four-II, a.tm-animated-button.hercai-one-III, a.tm-animated-button.hercai-two-III, a.tm-animated-button.hercai-three-III, a.tm-animated-button.hercai-four-III, a.tm-animated-button.rose-one,a.tm-animated-button.rose-one-I, a.tm-animated-button.rose-two,a.tm-animated-button.rose-two-I, a.tm-animated-button.rose-three,a.tm-animated-button.rose-three-I, a.tm-animated-button.rose-four,a.tm-animated-button.rose-four-I, a.tm-animated-button.rose-one-II, a.tm-animated-button.rose-two-II, a.tm-animated-button.rose-three-II, a.tm-animated-button.rose-four-II, a.tm-animated-button.benefse-one,a.tm-animated-button.benefse-one-I, a.tm-animated-button.benefse-two,a.tm-animated-button.benefse-two-I, a.tm-animated-button.benefse-three,a.tm-animated-button.benefse-three-I, a.tm-animated-button.benefse-four,a.tm-animated-button.benefse-four-I, a.tm-animated-button.benefse-one-II, a.tm-animated-button.benefse-two-II, a.tm-animated-button.benefse-three-II, a.tm-animated-button.benefse-four-II, a.tm-animated-button.kupe-one,a.tm-animated-button.kupe-one-I, a.tm-animated-button.kupe-two,a.tm-animated-button.kupe-two-I, a.tm-animated-button.kupe-three,a.tm-animated-button.kupe-three-I, a.tm-animated-button.kupe-four,a.tm-animated-button.kupe-four-I, a.tm-animated-button.kupe-one-II, a.tm-animated-button.kupe-two-II, a.tm-animated-button.kupe-three-II, a.tm-animated-button.kupe-four-II, a.tm-animated-button.hezaren-one,a.tm-animated-button.hezaren-one-I, a.tm-animated-button.hezaren-two,a.tm-animated-button.hezaren-two-I, a.tm-animated-button.hezaren-three,a.tm-animated-button.hezaren-three-I, a.tm-animated-button.hezaren-four,a.tm-animated-button.hezaren-four-I{ text-shadow: 0 1px rgba(0, 0, 0, 0.15); } /*------ I */ a.tm-animated-button.iris-one { border: 2px solid #17ba60; } a.tm-animated-button.iris-one:after { background: #17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.iris-two { border: 2px solid #17ba60; } a.tm-animated-button.iris-two:after { background: #17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.iris-three { border: 2px solid #17ba60; } a.tm-animated-button.iris-three:after { background: #17ba60; opacity: .5; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.iris-three:hover:after { height: 140%; opacity: 1; } a.tm-animated-button.iris-four { border: 2px solid #17ba60; } a.tm-animated-button.iris-four:after { background: #17ba60; opacity: .5; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.iris-four:hover:after { opacity: 1; height: 650% !important; } /*------ I-I */ a.tm-animated-button.iris-one-I:hover, a.tm-animated-button.iris-one-I:hover::after, a.tm-animated-button.iris-two-I:hover, a.tm-animated-button.iris-two-I:hover::after, a.tm-animated-button.iris-three-I:hover, a.tm-animated-button.iris-three-I:hover::after, a.tm-animated-button.iris-four-I:hover, a.tm-animated-button.iris-four-I:hover::after{ background-color: #17ba60 !important; border: 2px solid #17ba60 !important; color: #fff; } a.tm-animated-button.iris-one-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#17ba60; } a.tm-animated-button.iris-one-I:after { background-color:#17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.iris-two-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#17ba60; } a.tm-animated-button.iris-two-I:after { background: #17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.iris-three-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#17ba60; } a.tm-animated-button.iris-three-I:after { background: #17ba60; opacity: .5; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.iris-three-I:hover:after { height: 200%; opacity: 1; } a.tm-animated-button.iris-four-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#17ba60; } a.tm-animated-button.iris-four-I:after { background: #17ba60; opacity: .5; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.iris-four-I:hover:after { opacity: 1; height: 700% !important; } /*------ I-II */ a.tm-animated-button.iris-one-II:hover, a.tm-animated-button.iris-one-II:hover::after, a.tm-animated-button.iris-two-II:hover, a.tm-animated-button.iris-two-II:hover::after, a.tm-animated-button.iris-three-II:hover, a.tm-animated-button.iris-three-II:hover::after, a.tm-animated-button.iris-four-II:hover, a.tm-animated-button.iris-four-II:hover::after{ background-color: transparent !important; border: 2px solid #17ba60 !important; color: #17ba60; } a.tm-animated-button.iris-one-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.iris-one-II:after { background-color:#17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.iris-two-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.iris-two-II:after { background: #17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.iris-three-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.iris-three-II:after { background: #17ba60; opacity: .5; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.iris-three-II:hover:after { height: 200%; opacity: 1; } a.tm-animated-button.iris-four-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.iris-four-II:after { background: #17ba60; opacity: .5; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.iris-four-II:hover:after { opacity: 1; height: 700% !important; } /*------ I-II */ a.tm-animated-button.iris-one-III:hover, a.tm-animated-button.iris-one-III:hover::after, a.tm-animated-button.iris-two-III:hover, a.tm-animated-button.iris-two-III:hover::after, a.tm-animated-button.iris-three-III:hover, a.tm-animated-button.iris-three-III:hover::after, a.tm-animated-button.iris-four-III:hover, a.tm-animated-button.iris-four-III:hover::after{ background-color: transparent !important; border: 2px solid #17ba60 !important; color: #17ba60; } a.tm-animated-button.iris-one-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.iris-one-III:after { background-color:#17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.iris-two-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.iris-two-III:after { background: #17ba60; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.iris-three-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.iris-three-III:after { background: #17ba60; opacity: .5; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.iris-three-III:hover:after { height: 200%; opacity: 1; } a.tm-animated-button.iris-four-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.iris-four-III:after { background: #17ba60; opacity: .5; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.iris-four-III:hover:after { opacity: 1; height: 700% !important; } /*------ II */ a.tm-animated-button.hercai-one { border: 2px solid #579A57; color: #020307; } a.tm-animated-button.hercai-one:hover, a.tm-animated-button.hercai-two:hover, a.tm-animated-button.hercai-three:hover, a.tm-animated-button.hercai-four:hover{ color: #579A57; } a.tm-animated-button.hercai-one:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.hercai-one:hover:after { height: 120% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-two { border: 2px solid #579A57; color: #020307; } a.tm-animated-button.hercai-two:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.hercai-two:hover:after { height: 650% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-three { border: 2px solid #579A57; color: #020307; } a.tm-animated-button.hercai-three:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.hercai-three:hover:after { height: 400% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-four { border: 2px solid #579A57; color: #020307; } a.tm-animated-button.hercai-four:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(25deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(25deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(25deg); transform: translateY(-50%) translateX(-50%) rotate(25deg); } a.tm-animated-button.hercai-four:hover:after { height: 400% !important; opacity: 1; color: #FFF; } /*------ II-I */ a.tm-animated-button.hercai-one-I:hover, a.tm-animated-button.hercai-one-I:hover::after, a.tm-animated-button.hercai-two-I:hover, a.tm-animated-button.hercai-two-I:hover::after, a.tm-animated-button.hercai-three-I:hover, a.tm-animated-button.hercai-three-I:hover::after, a.tm-animated-button.hercai-four-I:hover, a.tm-animated-button.hercai-four-I:hover::after{ background-color: transparent !important; border: 2px solid #579A57 !important; color: #579A57; } a.tm-animated-button.hercai-one-I { background-color:transparent; border: 2px solid #579A57; border-radius:3px; color:#579A57; } a.tm-animated-button.hercai-one-I:after { background-color:#579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.hercai-one-I:hover:after { height: 120% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-two-I { background-color:transparent; border: 2px solid #579A57; border-radius:3px; color:#579A57; } a.tm-animated-button.hercai-two-I:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.hercai-two-I:hover:after { height: 650% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-three-I { background-color:transparent; border: 2px solid #579A57; border-radius:3px; color:#579A57; } a.tm-animated-button.hercai-three-I:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.hercai-three-I:hover:after { height: 400% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-four-I { background-color:transparent; border: 2px solid #579A57; border-radius:3px; color:#579A57; } a.tm-animated-button.hercai-four-I:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(25deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(25deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(25deg); transform: translateY(-50%) translateX(-50%) rotate(25deg); } a.tm-animated-button.hercai-four-I:hover:after { height: 400% !important; opacity: 1; color: #FFF; } /*------ II-II */ a.tm-animated-button.hercai-one-II:hover, a.tm-animated-button.hercai-one-II:hover::after, a.tm-animated-button.hercai-two-II:hover, a.tm-animated-button.hercai-two-II:hover::after, a.tm-animated-button.hercai-three-II:hover, a.tm-animated-button.hercai-three-II:hover::after, a.tm-animated-button.hercai-four-II:hover, a.tm-animated-button.hercai-four-II:hover::after{ background-color: transparent !important; border: 2px solid #579A57 !important; color: #579A57; } a.tm-animated-button.hercai-one-II { background-color:#579A57; border: 2px solid #579A57; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.hercai-one-II:after { background-color:#579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.hercai-one-II:hover:after { height: 120% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-two-II { background-color:#579A57; border: 2px solid #579A57; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.hercai-two-II:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.hercai-two-II:hover:after { height: 650% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-three-II { background-color:#579A57; border: 2px solid #579A57; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.hercai-three-II:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.hercai-three-II:hover:after { height: 400% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-four-II { background-color:#579A57; border: 2px solid #579A57; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.hercai-four-II:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(25deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(25deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(25deg); transform: translateY(-50%) translateX(-50%) rotate(25deg); } a.tm-animated-button.hercai-four-II:hover:after { height: 400% !important; opacity: 1; color: #FFF; } /*------ II-III */ a.tm-animated-button.hercai-one-III:hover, a.tm-animated-button.hercai-one-III:hover::after, a.tm-animated-button.hercai-two-III:hover, a.tm-animated-button.hercai-two-III:hover::after, a.tm-animated-button.hercai-three-III:hover, a.tm-animated-button.hercai-three-III:hover::after, a.tm-animated-button.hercai-four-III:hover, a.tm-animated-button.hercai-four-III:hover::after{ background-color: transparent !important; border: 2px solid #579A57 !important; color: #579A57; } a.tm-animated-button.hercai-one-III { background-color:#579A57; border: 2px solid #579A57; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.hercai-one-III:after { background-color:#579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.hercai-one-III:hover:after { height: 120% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-two-III { background-color:#579A57; border: 2px solid #579A57; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.hercai-two-III:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(90deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(90deg); transform: translateY(-50%) translateX(-50%) rotate(90deg); } a.tm-animated-button.hercai-two-III:hover:after { height: 650% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-three-III { background-color:#579A57; border: 2px solid #579A57; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.hercai-three-III:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.hercai-three-III:hover:after { height: 400% !important; opacity: 1; color: #FFF; } a.tm-animated-button.hercai-four-III { background-color:#579A57; border: 2px solid #579A57; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.hercai-four-III:after { border: 3px solid #579A57; opacity: 0; -moz-transform: translateY(-50%) translateX(-50%) rotate(25deg); -ms-transform: translateY(-50%) translateX(-50%) rotate(25deg); -webkit-transform: translateY(-50%) translateX(-50%) rotate(25deg); transform: translateY(-50%) translateX(-50%) rotate(25deg); } a.tm-animated-button.hercai-four-III:hover:after { height: 400% !important; opacity: 1; color: #FFF; } /*------ III */ a.tm-animated-button.rose-one { border: 2px solid #8B0B60; color: #020307; } a.tm-animated-button.rose-one:hover, a.tm-animated-button.rose-two:hover, a.tm-animated-button.rose-three:hover, a.tm-animated-button.rose-four:hover{ color: #8B0B60; } a.tm-animated-button.rose-one:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.rose-one:hover:after { height: 650% !important; opacity: 1; color: #020307; } a.tm-animated-button.rose-two { border: 2px solid #8B0B60; color: #020307; } a.tm-animated-button.rose-two:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.rose-two:hover:after { height: 650% !important; opacity: 1; color: #020307; } a.tm-animated-button.rose-three { border: 2px solid #8B0B60; color: #020307; } a.tm-animated-button.rose-three:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.rose-three:hover:after { height: 650% !important; opacity: 1; color: #020307; } a.tm-animated-button.rose-four { border: 2px solid #8B0B60; color: #020307; } a.tm-animated-button.rose-four:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.rose-four:hover:after { height: 650% !important; opacity: 1; color: #020307; } /*------ III-I */ a.tm-animated-button.rose-one-I:hover, a.tm-animated-button.rose-one-I:hover::after, a.tm-animated-button.rose-two-I:hover, a.tm-animated-button.rose-two-I:hover::after, a.tm-animated-button.rose-three-I:hover, a.tm-animated-button.rose-three-I:hover::after, a.tm-animated-button.rose-four-I:hover, a.tm-animated-button.rose-four-I:hover::after{ background-color: transparent !important; border: 2px solid #8B0B60 !important; color: #8B0B60; } a.tm-animated-button.rose-one-I { background-color:transparent; border: 2px solid #8B0B60; border-radius:3px; color:#8B0B60; } a.tm-animated-button.rose-one-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.rose-one-I:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-two-I { background-color:transparent; border: 2px solid #8B0B60; border-radius:3px; color:#8B0B60; } a.tm-animated-button.rose-two-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.rose-two-I:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-three-I { background-color:transparent; border: 2px solid #8B0B60; border-radius:3px; color:#8B0B60; } a.tm-animated-button.rose-three-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.rose-three-I:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-four-I { background-color:transparent; border: 2px solid #8B0B60; border-radius:3px; color:#8B0B60; } a.tm-animated-button.rose-four-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.rose-four-I:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } /*------ III-II */ a.tm-animated-button.rose-one-II:hover, a.tm-animated-button.rose-one-II:hover::after, a.tm-animated-button.rose-two-II:hover, a.tm-animated-button.rose-two-II:hover::after, a.tm-animated-button.rose-three-II:hover, a.tm-animated-button.rose-three-II:hover::after, a.tm-animated-button.rose-four-II:hover, a.tm-animated-button.rose-four-II:hover::after{ background-color: transparent !important; border: 2px solid #8B0B60 !important; color: #8B0B60; } a.tm-animated-button.rose-one-II { background-color:#8B0B60; border: 2px solid #8B0B60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.rose-one-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.rose-one-II:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-two-II { background-color:#8B0B60; border: 2px solid #8B0B60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.rose-two-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.rose-two-II:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-three-II { background-color:#8B0B60; border: 2px solid #8B0B60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.rose-three-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.rose-three-II:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-four-II { background-color:#8B0B60; border: 2px solid #8B0B60; border-radius:3px; color:#FFFFFF; } a.tm-animated-button.rose-four-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.rose-four-II:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } /*------ III-III */ a.tm-animated-button.rose-one-III:hover, a.tm-animated-button.rose-one-III:hover::after, a.tm-animated-button.rose-two-III:hover, a.tm-animated-button.rose-two-III:hover::after, a.tm-animated-button.rose-three-III:hover, a.tm-animated-button.rose-three-III:hover::after, a.tm-animated-button.rose-four-III:hover, a.tm-animated-button.rose-four-III:hover::after{ background-color: transparent !important; border: 2px solid #8B0B60 !important; color: #8B0B60; } a.tm-animated-button.rose-one-III { background-color:#8B0B60; border: 2px solid #8B0B60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.rose-one-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.rose-one-III:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-two-III { background-color:#8B0B60; border: 2px solid #8B0B60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.rose-two-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.rose-two-III:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-three-III { background-color:#8B0B60; border: 2px solid #8B0B60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.rose-three-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.rose-three-III:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } a.tm-animated-button.rose-four-III { background-color:#8B0B60; border: 2px solid #8B0B60; /*border-radius:3px;*/ color:#FFFFFF; } a.tm-animated-button.rose-four-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(139,11,96,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(139,11,96,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.rose-four-III:hover:after { height: 650% !important; opacity: 1; color: #8B0B60; } /*------ III */ a.tm-animated-button.benefse-one { background-color:transparent; border: 2px solid #fff; color:#fff; } a.tm-animated-button.benefse-one:hover, a.tm-animated-button.benefse-two:hover, a.tm-animated-button.benefse-three:hover, a.tm-animated-button.benefse-four:hover{ background-color: transparent !important; border: 2px solid #fff !important; color: #fff; } a.tm-animated-button.benefse-one:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.benefse-one:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-two { border: 2px solid #fff; color: #fff; } a.tm-animated-button.benefse-two:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.benefse-two:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-three { border: 2px solid #fff; color: #fff; } a.tm-animated-button.benefse-three:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.benefse-three:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-four { border: 2px solid #fff; color: #fff; } a.tm-animated-button.benefse-four:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.benefse-four:hover:after { height: 650% !important; opacity: 1; color: #fff; } /*------ III-I */ a.tm-animated-button.benefse-one-I:hover, a.tm-animated-button.benefse-one-I:hover::after, a.tm-animated-button.benefse-two-I:hover, a.tm-animated-button.benefse-two-I:hover::after, a.tm-animated-button.benefse-three-I:hover, a.tm-animated-button.benefse-three-I:hover::after, a.tm-animated-button.benefse-four-I:hover, a.tm-animated-button.benefse-four-I:hover::after{ background-color: transparent !important; border: 2px solid #fff !important; color: #fff; } a.tm-animated-button.benefse-one-I { background-color:transparent; border: 2px solid #fff; border-radius:3px; color:#fff; } a.tm-animated-button.benefse-one-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.benefse-one-I:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-two-I { background-color:transparent; border: 2px solid #fff; border-radius:3px; color:#fff; } a.tm-animated-button.benefse-two-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.benefse-two-I:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-three-I { background-color:transparent; border: 2px solid #fff; border-radius:3px; color:#fff; } a.tm-animated-button.benefse-three-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.benefse-three-I:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-four-I { background-color:transparent; border: 2px solid #fff; border-radius:3px; color:#fff; } a.tm-animated-button.benefse-four-I:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.benefse-four-I:hover:after { height: 650% !important; opacity: 1; color: #fff; } /*------ III-II */ a.tm-animated-button.benefse-one-II:hover, a.tm-animated-button.benefse-one-II:hover::after, a.tm-animated-button.benefse-two-II:hover, a.tm-animated-button.benefse-two-II:hover::after, a.tm-animated-button.benefse-three-II:hover, a.tm-animated-button.benefse-three-II:hover::after, a.tm-animated-button.benefse-four-II:hover, a.tm-animated-button.benefse-four-II:hover::after{ background-color: transparent !important; border: 2px solid #fff !important; color: #fff; } a.tm-animated-button.benefse-one-II { background-color:#fff; border: 2px solid #fff; border-radius:3px; color:#070743; } a.tm-animated-button.benefse-one-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.benefse-one-II:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-two-II { background-color:#fff; border: 2px solid #fff; border-radius:3px; color:#FA023C; } a.tm-animated-button.benefse-two-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.benefse-two-II:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-three-II { background-color:#fff; border: 2px solid #fff; border-radius:3px; color:#8e44ad; } a.tm-animated-button.benefse-three-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.benefse-three-II:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-four-II { background-color:#fff; border: 2px solid #fff; border-radius:3px; color:#17ba60; } a.tm-animated-button.benefse-four-II:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.benefse-four-II:hover:after { height: 650% !important; opacity: 1; color: #fff; } /*------ III-III */ a.tm-animated-button.benefse-one-III:hover, a.tm-animated-button.benefse-one-III:hover::after, a.tm-animated-button.benefse-two-III:hover, a.tm-animated-button.benefse-two-III:hover::after, a.tm-animated-button.benefse-three-III:hover, a.tm-animated-button.benefse-three-III:hover::after, a.tm-animated-button.benefse-four-III:hover, a.tm-animated-button.benefse-four-III:hover::after{ background-color: transparent !important; border: 2px solid #fff !important; color: #fff; } a.tm-animated-button.benefse-one-III { background-color:#fff; border: 2px solid #fff; /*border-radius:3px;*/ color:#070743; } a.tm-animated-button.benefse-one-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg); transform: translateX(-50%) translateY(-50%) rotate(25deg); } a.tm-animated-button.benefse-one-III:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-two-III { background-color:#fff; border: 2px solid #fff; /*border-radius:3px;*/ color:#FA023C; } a.tm-animated-button.benefse-two-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg); transform: translateX(-50%) translateY(-50%) rotate(-25deg); } a.tm-animated-button.benefse-two-III:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-three-III { background-color:#fff; border: 2px solid #fff; /*border-radius:3px;*/ color:#8e44ad; } a.tm-animated-button.benefse-three-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%) rotate(90deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg); transform: translateX(-50%) translateY(-50%) rotate(90deg); } a.tm-animated-button.benefse-three-III:hover:after { height: 650% !important; opacity: 1; color: #fff; } a.tm-animated-button.benefse-four-III { background-color:#fff; border: 2px solid #fff; /*border-radius:3px;*/ color:#17ba60; } a.tm-animated-button.benefse-four-III:after { opacity: 0; background-image: -webkit-linear-gradient( transparent 50%, rgba(255,255,255,0.2) 50%); background-image: -moz-linear-gradient(transparent 50%, rgba(255,255,255,0.2) 50%); background-size: 10px 10px; -moz-transform: translateX(-50%) translateY(-50%); /*-ms-transform: translateX(-50%) translateY(-50%));*/ -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } a.tm-animated-button.benefse-four-III:hover:after { height: 650% !important; opacity: 1; color: #fff; } /*------ IV */ a.tm-animated-button.kupe-one { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-one:hover { color: #fff !important; background-color: transparent; text-shadow: none; } a.tm-animated-button.kupe-one:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.kupe-one:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two:hover { color: #fff !important; background-color: transparent; text-shadow: ntwo; } a.tm-animated-button.kupe-two:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.kupe-two:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-three { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-three:hover { color: #fff !important; background-color: transparent; text-shadow: nthree; } a.tm-animated-button.kupe-three:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.kupe-three:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four:hover { color: #fff !important; background-color: transparent; text-shadow: nfour; } a.tm-animated-button.kupe-four:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.kupe-four:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*---- IV-I */ a.tm-animated-button.kupe-one-I:hover, a.tm-animated-button.kupe-two-I:hover, a.tm-animated-button.kupe-three-I:hover, a.tm-animated-button.kupe-four-I:hover{ background-color: transparent !important; border: 2px solid #17ba60 !important; color: #fff; } a.tm-animated-button.kupe-one-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#020307; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-one-I:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.kupe-one-I:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#020307; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-I:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.kupe-two-I:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-three-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#020307; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-three-I:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.kupe-three-I:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-I { background-color:transparent; border: 2px solid #17ba60; border-radius:3px; color:#020307; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-I:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.kupe-four-I:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ IV-II */ a.tm-animated-button.kupe-one-II:hover, a.tm-animated-button.kupe-two-II:hover, a.tm-animated-button.kupe-three-II:hover, a.tm-animated-button.kupe-four-II:hover{ background-color: transparent !important; border: 2px solid #17ba60 !important; color: #fff; } a.tm-animated-button.kupe-one-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-one-II:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.kupe-one-II:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-II:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.kupe-two-II:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-three-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-three-II:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.kupe-three-II:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-II { background-color:#17ba60; border: 2px solid #17ba60; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-II:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.kupe-four-II:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ IV-III */ a.tm-animated-button.kupe-one-III:hover, a.tm-animated-button.kupe-two-III:hover, a.tm-animated-button.kupe-three-III:hover, a.tm-animated-button.kupe-four-III:hover{ background-color: transparent !important; border: 2px solid #17ba60 !important; color: #fff; } a.tm-animated-button.kupe-one-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-one-III:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.kupe-one-III:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-two-III:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.kupe-two-III:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.kupe-three-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-three-III:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.kupe-three-III:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-III { background-color:#17ba60; border: 2px solid #17ba60; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.kupe-four-III:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.kupe-four-III:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #17ba60; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ V */ a.tm-animated-button.hezaren-one { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-one:hover { color: #fff !important; background-color: transparent; text-shadow: none; } a.tm-animated-button.hezaren-one:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.hezaren-one:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two:hover { color: #fff !important; background-color: transparent; text-shadow: ntwo; } a.tm-animated-button.hezaren-two:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.hezaren-two:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-three { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-three:hover { color: #fff !important; background-color: transparent; text-shadow: nthree; } a.tm-animated-button.hezaren-three:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.hezaren-three:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four:hover { color: #fff !important; background-color: transparent; text-shadow: nfour; } a.tm-animated-button.hezaren-four:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.hezaren-four:before { background: #E82B27; color: #020307 !important; display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ V */ a.tm-animated-button.hezaren-one-I { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; border-radius: 3px; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-one-I:hover { color: #fff !important; background-color: transparent; text-shadow: none; } a.tm-animated-button.hezaren-one-I:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.hezaren-one-I:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-I { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; border-radius: 3px; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-I:hover { color: #fff !important; background-color: transparent; text-shadow: ntwo; } a.tm-animated-button.hezaren-two-I:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.hezaren-two-I:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-three-I { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; border-radius: 3px; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-three-I:hover { color: #fff !important; background-color: transparent; text-shadow: nthree; } a.tm-animated-button.hezaren-three-I:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.hezaren-three-I:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-I { color: #020307; cursor: pointer; display: block; position: relative; border: 2px solid #E82B27; border-radius: 3px; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-I:hover { color: #fff !important; background-color: transparent; text-shadow: nfour; } a.tm-animated-button.hezaren-four-I:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.hezaren-four-I:before { background: #E82B27; color: #020307 !important; display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ V-I */ a.tm-animated-button.hezaren-one-II:hover, a.tm-animated-button.hezaren-two-II:hover, a.tm-animated-button.hezaren-three-II:hover, a.tm-animated-button.hezaren-four-II:hover{ background-color: transparent !important; border: 2px solid #E82B27 !important; color: #fff; } a.tm-animated-button.hezaren-one-II { background-color:#E82B27; border: 2px solid #E82B27; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-one-II:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.hezaren-one-II:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-II { background-color:#E82B27; border: 2px solid #E82B27; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-II:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.hezaren-two-II:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-three-II { background-color:#E82B27; border: 2px solid #E82B27; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-three-II:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.hezaren-three-II:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-II { background-color:#E82B27; border: 2px solid #E82B27; border-radius:3px; color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-II:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.hezaren-four-II:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /*------ V-III */ a.tm-animated-button.hezaren-one-III:hover, a.tm-animated-button.hezaren-two-III:hover, a.tm-animated-button.hezaren-three-III:hover, a.tm-animated-button.hezaren-four-III:hover{ background-color: transparent !important; border: 2px solid #E82B27 !important; color: #fff; } a.tm-animated-button.hezaren-one-III { background-color:#E82B27; border: 2px solid #E82B27; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-one-III:hover:before { bottom: 0%; top: auto; height: 100%; } a.tm-animated-button.hezaren-one-III:before { display: block; position: absolute; left: 0px; top: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-III { background-color:#E82B27; border: 2px solid #E82B27; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-two-III:hover:before { top: 0%; bottom: auto; height: 100%; } a.tm-animated-button.hezaren-two-III:before { display: block; position: absolute; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } a.tm-animated-button.hezaren-three-III { background-color:#E82B27; border: 2px solid #E82B27; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-three-III:hover:before { left: 0%; right: auto; width: 100%; } a.tm-animated-button.hezaren-three-III:before { display: block; position: absolute; top: 0px; right: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-III { background-color:#E82B27; border: 2px solid #E82B27; /*border-radius:3px;*/ color:#FFFFFF; cursor: pointer; display: block; position: relative; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } a.tm-animated-button.hezaren-four-III:hover:before { right: 0%; left: auto; width: 100%; } a.tm-animated-button.hezaren-four-III:before { display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 0px; z-index: -1; content: ''; color: #020307 !important; background: #E82B27; transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; } /* ----------------------------------------------- C. BUTTONS ---------------------------------------------------- */ /* ----------------------------------------------- D. GALLERY ---------------------------------------------------- */ img[data-gallery] { cursor: pointer } .overlay { background: rgba(0,0,0,0.9); width: 100%; height: 100%; position: fixed; top: 0; display: none; z-index: 99999; } .imgActive img { max-width: 100%; max-height: 90%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .prev, .next, .close { color: white; font-size: 3rem; display: inline-block; margin: 15px; /*position: absolute; top: 2%; right: 1%;*/ z-index: 1000; opacity: 1; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all; -ms-transition: 0.3s ease all; -o-transition: 0.3s ease all; transition: 0.3s ease all; } .prev i.fa, .next i.fa { font-size: 46px;} .prev:hover, .next:hover, .close:hover { cursor: pointer; opacity: 1 } .prev, .next { -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50% } .prev { left: 100px } .next { right: 100px } .imgActive + .close { font-size: 3rem; /* 1rem = 16px*/ position: absolute; top: 20px; right: 20px } .coverImgOverlay { width: 3000%; height: 100px; overflow: hidden; position: absolute; bottom: 20px; left: 50%; z-index: 1000 } .coverImgOverlay span { display: inline-block; width: 100px; height: 100px; margin: 5px; position: relative; overflow: hidden; } .coverImgOverlay img { width: auto; max-height: 100%; min-width: 100%; position: absolute; top: 50%; left: 50%; opacity: 0.2; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all; -ms-transition: 0.3s ease all; -o-transition: 0.3s ease all; transition: 0.3s ease all; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .coverImgOverlay img:hover { opacity: 1 !important } /* ----------------------------------------------- D. GALLERY ---------------------------------------------------- */ /* ----------------------------------------------- E. ACCENT-TEXT ------------------------------------------------ */ .accent-text{ line-height:26px; margin:2px 3px; padding:3px 5px; } .accent-text.red { background-color: #17ba60; } .accent-text.lightred { background-color: #FA023C; } .accent-text.turquoise { background-color: #3FB8AF; } .accent-text.darkturquoise { background-color: #169D99; } .accent-text.lightturquoise { background-color: #7FC7AF; } .accent-text.pink { background-color: #d770ad; } .accent-text.worldpink { background-color: #AB0768; } .accent-text.lightpink { background-color: #FF3D7F; } .accent-text.babypink { background-color: #FF9E9D; } .accent-text.grey { background-color: #ccc; } .accent-text.yellow { background-color: #edde45; } .accent-text.staryellow { background-color: #FAE894; } .accent-text.green { background-color: #A0D36E; } .accent-text.lightgreen { background-color: #B9CC01; } .accent-text.black { background-color: #020307; } .accent-text.tm { background-color: #321E41; } .accent-text.blue { background-color: #3C8DC5; } .accent-text.navyblue { background-color: #070743; } .accent-text.purple { background-color: #8e44ad; } /* ----------------------------------------------- F. ACCENT-TEXT ------------------------------------------------ */ /* ----------------------------------------------- F. TEXT/ BACKGROUND COLOR ------------------------------------- */ .text-red{color:#17ba60;} .text-lightred{color:#FA023C;} .text-turquoise{color:#3FB8AF;} .text-darkturquoise{color:#169D99;} .text-lightturquoise{color:#7FC7AF;} .text-green{color:#A0D36E;} .text-lightgreen{color:#B9CC01;} .text-yellow{color:#edde45;} .text-staryellow{color:#FAE894;} .text-pink{color:#d770ad;} .text-worldpink{color:#AB0768;} .text-lightpink{color:#FF3D7F;} .text-babypink{color:#FF9E9D;} .text-tm{color:#17ba60;} .text-tm-{color:#321E41;} .text-tm--{color:#020307;} .text-blue{color:#3C8DC5;} .text-navyblue{color:#070743;} .text-purple{color:#8e44ad;} .text-white{color:#ffffff;} .text-black{color:#020307;} .text-grey{color:#cccccc;} /*------*/ .red-bg{background:#17ba60;} .lightred-bg{background:#FA023C;} .turquoise-bg{background:#3FB8AF;} .darkturquoise-bg{background:#169D99;} .lightturquoise-bg{background:#7FC7AF;} .green-bg{background:#A0D36E;} .lightgreen-bg{background:#B9CC01;} .yellow-bg{background:#edde45;} .staryellow-bg{background:#FAE894;} .pink-bg{background:#d770ad;} .worldpink-bg{background:#AB0768;} .lightpink-bg{background:#FF3D7F;} .babypink-bg{background:#FF9E9D;} .tm-bg{background:#17ba60;} .tm--bg{background:#321E41;} .tm---bg{background:#020307;} .blue-bg{background:#3C8DC5;} .navyblue-bg{background:#070743;} .purple-bg{background:#8e44ad;} .white-bg{background:#ffffff;} .black-bg{background:#020307;} .grey-bg{background:#cccccc;} /* ----------------------------------------------- F. TEXT/ BACKGROUND COLOR ------------------------------------- */ /* ----------------------------------------------- G. LIGHTBOX --------------------------------------------------- */ /*#facebox .b { background:url(../fbox/b.png); } #facebox .tl { background:url(../fbox/tl.png); } #facebox .tr { background:url(../fbox/tr.png); } #facebox .bl { background:url(../fbox/bl.png); } #facebox .br { background:url(../fbox/br.png); }*/ #facebox { position: absolute; top: 0; left: 0; z-index: 99999999; text-align: left; } #facebox .content{ min-width:650px;} #facebox .popup { position: relative; bottom:30px;/*---------------------SONRADAN*/ border: 10px solid rgba(6,45,85,.7); border-radius:4px; } #facebox table { width:100% !important; border-collapse: collapse; } #facebox td { border-bottom: 0; padding: 0; } #facebox .body { padding: 10px 15px; background: #fff; width:auto; } #facebox .loading { text-align: center; } #facebox .image { text-align: center; } #facebox img { float:right; border: 0; margin: 0; } #facebox .footer { border-top: 1px solid rgba(166,172,167,.8); padding-top: 5px; margin-top: 10px; text-align: right; } #facebox .footer a.close{ width: 40px; height: 40px; line-height: 40px; margin: 0px; position: relative; border-radius: 50%; } #facebox .footer a.close::before{ font-family:'FontAwesome'; font-size: 18px; color:#020307; text-align: center; border-radius: 0 6px 0 0; content: "\f00d"; width: 40px; height: 40px; line-height: 40px; position: absolute; left: 0; } #facebox .footer a.close::after { content:''; display:block; opacity:0; position:absolute; transition-duration:.15s; transition-timing-function:cubic-bezier(0.4,0.0,0.2,1); z-index:-1; bottom:-10px; left:-10px; right:-10px; top:-10px; background:none; border-radius:50%; box-sizing:border-box; transform:scale(0); transition-property:transform, opacity; } #facebox .footer a.close:hover::after{ background-color:rgba(2,3,7,0.2); border:none; box-shadow:none; opacity:1; transform:scale(0.7) } #facebox .tl, #facebox .tr, #facebox .bl, #facebox .br { height: 0px; width: 0px; overflow: hidden; padding: 0; } #facebox_overlay { position: fixed; top: 0px; left: 0px; height:100%; width:100%; } .facebox_hide { z-index:-100; } .facebox_overlayBG { background-color: #062d55; z-index: 99999; } * html #facebox_overlay { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); } /* ----------------------------------------------- G. LIGHTBOX --------------------------------------------------- */ /* ----------------------------------------------- H. ARTICLE MARK ----------------------------------------------- */ ul.list-options { list-style: none; padding: 0px; margin: 0px 0 20px 0; } ul.list-options li { background: rgba(166,172,167,.6); font: 400 13px/22px 'tm-r',sans-serif; color: #020307; padding: 12px 14px; margin-bottom: 4px; } ul.list-options li span { font: 400 13px/22px 'tm-r',sans-serif; color: #020307; } ul.list-options li i { margin-right: 12px; color: #17ba60; } .general-list ul, .general-list ol, .general-list ol * ol, .general-list ol * ul, .general-list ul * ul, .general-list ul * ol{font:400 13px/22px 'tm-r',sans-serif;color:#020307;list-style:none;padding:0 0 0 20px;} .general-list ol li, .general-list ul li{margin:5px 0; padding-left:20px; position: relative; line-height: 22px;} .general-list ol li:after, .general-list ul li:after{content:"\f00c";font-family:'FontAwesome';font-size:14px;position:absolute;color:#17ba60;left:0;top:0;} .general-list ol * ol li, .general-list ol * ul li, .general-list ul * ul li, .general-list ul * ol li{list-style-type:none; padding-left:15px; position:relative;} .general-list ol * ol li:after, .general-list ul * ol li:after{content:"\f111" !important;font-family:'FontAwesome';font-size:9px !important;position:absolute;color:#17ba60;left:0;top:0;} .general-list ul * ul li:after, .general-list ol * ul li:after{content:"\f068";font-family:'FontAwesome';font-size:14px;position:absolute;color:#17ba60;left:0;top:0;} ul.list {font: 400 13px/22px 'tm-r',sans-serif;color:#020307; padding:0; margin:0; } ul.list li { margin:5px 0; padding-left:20px; position: relative; line-height: 22px; } ul.list i { position: absolute; left: 0; top: 5px; } ul.list.site-color li i { color: #17ba60; } ul.list.site-color li { color: #020307; } ul.list li:after {content:""; font-family:'FontAwesome';position:absolute;color:#17ba60; left:0; top:0; } /* Ul List Mark */ ul.list-mark{padding:0; margin:0;} ul.list-mark li{list-style-type:none; padding-left:20px; position:relative;} ul.list-mark li:after{content:"\f00c"; font-size:14px;} /* Ul List Arrow */ ul.list-arrow{padding:0; margin:0;} ul.list-arrow li{list-style-type:none; padding-left:15px; position:relative;} ul.list-arrow li:after{content:"\f105"; font-size:16px;} /* Ul List line */ ul.list-line{padding:0; margin:0;} ul.list-line li{list-style-type:none; padding-left:20px; position:relative;} ul.list-line li:after{content:"\f068"; font-size:14px;} /* Ul List line-xs */ ul.list-line-xs{padding:0; margin:0;} ul.list-line-xs li{list-style-type:none; padding-left:15px; position:relative;} ul.list-line-xs li:after{content:"\f068"; font-size:10px;} /* Ul List Hand */ ul.list-hand{padding:0; margin:0;} ul.list-hand li{list-style-type:none; padding-left:20px; position:relative;} ul.list-hand li:after{content:"\f0a4"; font-size:14px;} /* Ul List Edit */ ul.list-edit{padding:0; margin:0;} ul.list-edit li{list-style-type:none; padding-left:20px; position:relative;} ul.list-edit li:after{content:"\f040"; font-size:14px;} /* Ul List angle double arrow */ ul.list-angle-double{padding:0; margin:0;} ul.list-angle-double li{list-style-type:none; padding-left:20px; position:relative;} ul.list-angle-double li:after{content:"\f101"; font-size:16px;} ul.list-arrow-circle-right{padding:0; margin:0;} ul.list-arrow-circle-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-arrow-circle-right li:after{content:"\f0a9"; font-size:16px;} ul.list-arrow-circle-o-right{padding:0; margin:0;} ul.list-arrow-circle-o-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-arrow-circle-o-right li:after{content:"\f18e"; font-size:16px;} ul.list-arrow-right{padding:0; margin:0;} ul.list-arrow-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-arrow-right li:after{content:"\f061"; font-size:16px;} ul.list-caret-right {padding:0; margin:0;} ul.list-caret-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-caret-right li:after{content:"\f0da"; font-size:16px;} ul.list-caret-square-o-right {padding:0; margin:0;} ul.list-caret-square-o-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-caret-square-o-right li:after{content:"\f152"; font-size:16px;} ul.list-chevron-circle-right {padding:0; margin:0;} ul.list-chevron-circle-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-chevron-circle-right li:after{content:"\f138"; font-size:16px;} ul.list-long-arrow-right {padding:0; margin:0;} ul.list-long-arrow-right li{list-style-type:none; padding-left:20px; position:relative;} ul.list-long-arrow-right li:after{content:"\f178"; font-size:16px;} /* ----------------------------------------------- H. ARTICLE MARK ----------------------------------------------- */ /* ----------------------------------------------- I. DIVIDER-LINE ----------------------------------------------- */ .divider-line { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; width: 100%; height: 0; margin: 0; display: block; } hr.divider-line { margin: 20px 0; border-bottom:none; } .divider-line.solid { border-top: 1px solid #eee; } .divider-line.dashed { border-top: 1px dashed #eee; } .divider-line.dotted { border-top: 1px dotted #eee; } .divider-line.groove { border-top: 1px groove #eee; } .divider-line.ridge { border-top: 1px ridge #eee; } .divider-line.inset { border-top: 1px inset #eee; } .divider-line.outset { border-top: 1px outset #eee; } .divider-line.double { border-bottom: 1px solid #eee; border-top: 1px solid #eee; display: block; height: 5px; } .divider-line.red { border-color: #17ba60; } .divider-line.lightred { border-color: #FA023C; } .divider-line.turquoise { border-color: #3FB8AF; } .divider-line.darkturquoise { border-color: #169D99; } .divider-line.lightturquoise { border-color: #7FC7AF; } .divider-line.pink { border-color: #d770ad; } .divider-line.worldpink { border-color: #AB0768; } .divider-line.lightpink { border-color: #FF3D7F; } .divider-line.babypink { border-color: #FF9E9D; } .divider-line.grey { border-color: #ccc; } .divider-line.yellow { border-color: #edde45; } .divider-line.staryellow { border-color: #FAE894; } .divider-line.green { border-color: #A0D36E; } .divider-line.lightgreen { border-color: #B9CC01; } .divider-line.black { border-color: #020307; } .divider-line.tm { border-color: #321E41; } .divider-line.blue { border-color: #3C8DC5; } .divider-line.navyblue { border-color: #070743; } .divider-line.purple { border-color: #8e44ad; } /* ----------------------------------------------- I. DIVIDER-LINE ----------------------------------------------- */ /* ----------------------------------------------- J. BOX/ED ----------------------------------------------------- */ .boxed-public{ background-color:#FFFFFF; color:#020307; border: none; margin:0 0 20px 0; box-shadow:0 1px 3px rgba(0, 0, 0, 0.2); } .boxed-public:hover { /*transform: translateY(-3px);*/ box-shadow: 0 1px 3px rgba(128, 128, 128, 0.3), 0 10px 6px -6px rgba(128, 128, 128, 0.3); } .boxed-public.active{ background-color:#17ba60; } .boxed-public b, .boxed-public strong{ font-weight:bold;} .boxed-public em i{ font-size: 44px; color: #fff; text-align: center; float: none; margin: 7px 0 7px 0; } /*-----------*/ .boxtitle-top { background:#17ba60; font: 700 16px/22px 'tm-b',sans-serif; color: #fff; border: none !important; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; margin: 0 0 20px 0; padding: 5px 10px; position: absolute; top: -1px; left: 7%; transform: translate(0) !important; transition: none; } .boxed-public.active h1, .boxed-public.active h2, .boxed-public.active h3, .boxed-public.active h4, .boxed-public.active h5, .boxed-public.active h6{ color: #fff;} .boxed-public h1 { font: 700 20px/22px 'tm-b',sans-serif; color: #020307; margin: 5px 0 15px 0; padding: 2px 0 5px 0; } .boxed-public div h2 { font: 400 14px/22px 'tm-m',sans-serif; color: #020307; margin: 0 0 7px 0; padding: 0; } .boxed-public div { font: 400 13px/22px 'tm-r',sans-serif; color: #020307; margin: 0 0 12px 0; padding: 0; } /*.boxed-public div h2:first-letter { font: 600 20px/20px 'tm-b',sans-serif; padding: 0; margin: 0; }*/ .boxed-public h3 { font: 400 13px/18px 'tm-r',sans-serif; color: #020307; text-align:left; margin: 0 0 15px 0; padding: 0; } .boxed-public h3 > div::first-letter, .boxed-public h4 > div::first-letter { background-color:#fff; font: 400 24px/30px "tm-r",sans-serif; color:#17ba60; border-radius:4px; float: left; padding:8px 10px; margin: 0px 5px 0px 0px; } .boxed-public h4 { font: 400 13px/18px 'tm-r',sans-serif; color: #020307; text-align:left; margin: 2px 0 3px 0; padding: 0; } .boxed-public h5 { font: 700 22px/22px 'tm-b',sans-serif; color: #020307; margin: 2px 0 3px 0; padding: 2px 0 5px 0; } /*--------*/ .boxed-public code{ background-color:transparent; font: 400 13px/22px "tm-r",sans-serif; color:#020307; text-align:justify; margin:10px 0px; padding:10px 5px 5px 40px; display:block; position:relative; border-radius:0; } .boxed-public code::before{ font-family:'FontAwesome'; font-size:54px; font-style:inherit; font-weight:bold; color:rgba(166,172,167,0.6); content:"\201c"; position:absolute; top:0; left:0; width:auto; padding:0 10px 0 0; height:auto; line-height:45px; } .boxed-public code a{ font: italic 400 13px/22px "tm-r",sans-serif; color:#020307; text-align:right; padding:2px 10px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .boxed-public code a:hover{ color: rgba(255,170,0, 0.8); text-decoration:none; } /*------*/ .boxed-general { background-color: #fff; border: 1px solid rgba(166,172,167,0.6); /*min-height: 195px;*/ padding:1rem; } /*.boxed-general-body { padding:1rem; }*/ /* ----------------------------------------------- J. BOX/ED ----------------------------------------------------- */ /* ----------------------------------------------- K. TOOLTIPS --------------------------------------------------- */ .tooltip-wrap .tooltip { position: absolute; z-index: 1; left: -9999px; padding: 2px 8px 3px; font-size: 11px; line-height: 16px; font-weight: 400; background: rgba(0,0,0,0.9); color: #fff; opacity: 0; transition: margin 0.3s, opacity 0.3s; -o-transition: margin 0.3s, opacity 0.3s; -ms-transition: margin 0.3s, opacity 0.3s; -moz-transition: margin 0.3s, opacity 0.3s; -webkit-transition: margin 0.3s, opacity 0.3s; } .tooltip-wrap .tooltip:after { content: ''; position: absolute; } .tooltip-wrap .input input:focus + .tooltip, .tooltip-wrap .textarea textarea:focus + .tooltip { opacity: 1; } .tooltip-wrap .tooltip-top-right { bottom: 100%; margin-bottom: 15px; } .tooltip-wrap .tooltip-top-right:after { top: 100%; right: 16px; border-top: 4px solid rgba(0,0,0,0.9); border-right: 4px solid transparent; border-left: 4px solid transparent; } .tooltip-wrap .input input:focus + .tooltip-top-right, .tooltip-wrap .textarea textarea:focus + .tooltip-top-right { right: 0; left: auto; margin-bottom: 5px; } .tooltip-wrap .tooltip-top-left { bottom: 100%; margin-bottom: 15px; } .tooltip-wrap .tooltip-top-left:after { top: 100%; left: 16px; border-top: 4px solid rgba(0,0,0,0.9); border-right: 4px solid transparent; border-left: 4px solid transparent; } .tooltip-wrap .input input:focus + .tooltip-top-left, .tooltip-wrap .textarea textarea:focus + .tooltip-top-left { right: auto; left: 0; margin-bottom: 5px; } .tooltip-wrap .tooltip-right { top: 9px; white-space: nowrap; margin-left: 15px; } .tooltip-wrap .tooltip-right:after { top: 6px; right: 100%; border-top: 4px solid transparent; border-right: 4px solid rgba(0,0,0,0.9); border-bottom: 4px solid transparent; } .tooltip-wrap .input input:focus + .tooltip-right, .tooltip-wrap .textarea textarea:focus + .tooltip-right { left: 100%; margin-left: 5px; } .tooltip-wrap .tooltip-left { top: 9px; white-space: nowrap; margin-right: 15px; } .tooltip-wrap .tooltip-left:after { top: 6px; left: 100%; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid rgba(0,0,0,0.9); } .tooltip-wrap .input input:focus + .tooltip-left, .tooltip-wrap .textarea textarea:focus + .tooltip-left { right: 100%; left: auto; margin-right: 5px; } .tooltip-wrap .tooltip-bottom-right { top: 100%; margin-top: 15px; } .tooltip-wrap .tooltip-bottom-right:after { bottom: 100%; right: 16px; border-right: 4px solid transparent; border-bottom: 4px solid rgba(0,0,0,0.9); border-left: 4px solid transparent; } .tooltip-wrap .input input:focus + .tooltip-bottom-right, .tooltip-wrap .textarea textarea:focus + .tooltip-bottom-right { right: 0; left: auto; margin-top: 5px; } .tooltip-wrap .tooltip-bottom-left { top: 100%; margin-top: 15px; } .tooltip-wrap .tooltip-bottom-left:after { bottom: 100%; left: 16px; border-right: 4px solid transparent; border-bottom: 4px solid rgba(0,0,0,0.9); border-left: 4px solid transparent; } .tooltip-wrap .input input:focus + .tooltip-bottom-left, .tooltip-wrap .textarea textarea:focus + .tooltip-bottom-left { right: auto; left: 0; margin-top: 5px; } /*---*/ .stips-wrap { position: relative; display: inline-block; /*border-bottom: 1px dotted black;*/ } .stips-wrap .stext { background-color:rgba(2,3,7); font: 400 12px/19px "tm-r",sans-serif; color: #fff; text-align: center; border-radius: 3px; min-width: 130px; padding: 3px 0; position: absolute; visibility: hidden; z-index: 1; } .stips-wrap .stext::after { content: ""; position: absolute; border-width: 5px; border-style: solid; } /*-------*/ .stips-wrap .stext.stips-top { bottom: 100%; /*150%*/left: 50%; margin-left: -68px;margin-bottom: 7px; } .stips-wrap .stext.stips-top::after { top: 100%; left: 50%; margin-left: -5px; border-color: black transparent transparent transparent;} .stips-wrap .stext.stips-top-one { bottom: 150%;left: 50%; margin-left: -20px; } .stips-wrap .stext.stips-top-one::after { top: 100%; left:10%; margin-left: -5px; border-color: black transparent transparent transparent;} .stips-wrap .stext.stips-top-two { bottom: 150%;right: 0%; margin-right: -20px; } .stips-wrap .stext.stips-top-two::after { top: 100%; right:10%; margin-left: -5px; border-color: black transparent transparent transparent;} /*-------*/ .stips-wrap .stext.stips-right { left: 120%; top:0px; } .stips-wrap .stext.stips-right::after { right: 100%; top: 50%; margin-top: -5px; border-color: transparent black transparent transparent;} /*-------*/ .stips-wrap .stext.stips-bottom { top: 145%;left: 50%; margin-left: -56px; } .stips-wrap .stext.stips-bottom::after { bottom: 100%; left: 50%; margin-left: -5px; border-color: transparent transparent black transparent;} /*-------*/ .stips-wrap .stext.stips-left { right: 120%; top: 0px; } .stips-wrap .stext.stips-left::after { left: 100%; top: 50%; margin-top: -5px; border-color: transparent transparent transparent black; } .stips-wrap:hover .stext { visibility: visible; } /* ----------------------------------------------- K. TOOLTIPS --------------------------------------------------- */ /* ----------------------------------------------- L. MARGIN-PADDING --------------------------------------------- */ .mall-0{margin:0px !important;} .mall-5{margin:5px !important;} .mall-10{margin:10px !important;} .mall-20{margin:20px !important;} .mall-30{margin:30px !important;} .mall-40{margin:40px !important;} .mall-50{margin:50px !important;} .mall-60{margin:60px !important;} .mall-70{margin:70px !important;} .mall-80{margin:80px !important;} .mall-90{margin:90px !important;} .mall-100{margin:100px !important;} .mt-0 { margin-top: 0px !important; } .mt-10 { margin-top: 10px !important; } .mt-20 { margin-top: 20px !important; } .mt-30 { margin-top: 30px !important; } .mt-40 { margin-top: 40px !important; } .mt-50 { margin-top: 50px !important; } .mt-60 { margin-top: 60px !important; } .mt-70 { margin-top: 70px !important; } .mt-80 { margin-top: 80px !important; } .mt-90 { margin-top: 90px !important; } .mt-100 { margin-top: 100px !important; } .mr-0 { margin-right: 0px !important; } .mr-10 { margin-right: 10px !important; } .mr-20 { margin-right: 20px !important; } .mr-30 { margin-right: 30px !important; } .mr-40 { margin-right: 40px !important; } .mr-50 { margin-right: 50px !important; } .mr-60 { margin-right: 60px !important; } .mr-70 { margin-right: 70px !important; } .mr-80 { margin-right: 80px !important; } .mr-90 { margin-right: 90px !important; } .mr-100 { margin-right: 100px !important; } .mb-0 { margin-bottom: 0px !important; } .mb-10 { margin-bottom: 10px !important; } .mb-20 { margin-bottom: 20px !important; } .mb-30 { margin-bottom: 30px !important; } .mb-40 { margin-bottom: 40px !important; } .mb-50 { margin-bottom: 50px !important; } .mb-60 { margin-bottom: 60px !important; } .mb-70 { margin-bottom: 70px !important; } .mb-80 { margin-bottom: 80px !important; } .mb-90 { margin-bottom: 90px !important; } .mb-100 { margin-bottom: 100px !important; } .ml-0 { margin-left: 0px !important; } .ml-10 { margin-left: 10px !important; } .ml-20 { margin-left: 20px !important; } .ml-30 { margin-left: 30px !important; } .ml-40 { margin-left: 40px !important; } .ml-50 { margin-left: 50px !important; } .ml-60 { margin-left: 60px !important; } .ml-70 { margin-left: 70px !important; } .ml-80 { margin-left: 80px !important; } .ml-90 { margin-left: 90px !important; } .ml-100 { margin-left: 100px !important; } /*-----*/ .pall-0{padding:0px !important;} .pall-5{padding:5px !important;} .pall-10{padding:10px !important;} .pall-20{padding:20px !important;} .pall-30{padding:30px !important;} .pall-40{padding:40px !important;} .pall-50{padding:50px !important;} .pall-60{padding:60px !important;} .pall-70{padding:70px !important;} .pall-80{padding:80px !important;} .pall-90{padding:90px !important;} .pall-100{padding:100px !important;} .ptb-0{padding:0 0 !important;} .ptb-5{padding:5px 0 !important;} .ptb-10{padding:10px 0 !important;} .ptb-20{padding:20px 0 !important;} .ptb-30{padding:30px 0 !important;} .ptb-40{padding:40px 0 !important;} .ptb-50{padding:50px 0 !important;} .ptb-60{padding:60px 0 !important;} .ptb-70{padding:70px 0 !important;} .ptb-80{padding:80px 0 !important;} .ptb-90{padding:90px 0 !important;} .ptb-100{padding:100px 0 !important;} .pt-0 { padding-top: 0px !important; } .pt-5 { padding-top: 5px !important; } .pt-10 { padding-top: 10px !important; } .pt-20 { padding-top: 20px !important; } .pt-30 { padding-top: 30px !important; } .pt-40 { padding-top: 40px !important; } .pt-50 { padding-top: 50px !important; } .pt-60 { padding-top: 60px !important; } .pt-70 { padding-top: 70px !important; } .pt-80 { padding-top: 80px !important; } .pt-90 { padding-top: 90px !important; } .pt-100 { padding-top: 100px !important; } .pr-10 { padding-right: 10px !important; } .pr-20 { padding-right: 20px !important; } .pr-30 { padding-right: 30px !important; } .pr-40 { padding-right: 40px !important; } .pr-50 { padding-right: 50px !important; } .pr-60 { padding-right: 60px !important; } .pr-70 { padding-right: 70px !important; } .pr-80 { padding-right: 80px !important; } .pr-90 { padding-right: 90px !important; } .pr-100 { padding-right: 100px !important; } .pb-0 { padding-bottom: 0px !important; } .pb-10 { padding-bottom: 10px !important; } .pb-20 { padding-bottom: 20px !important; } .pb-30 { padding-bottom: 30px !important; } .pb-40 { padding-bottom: 40px !important; } .pb-50 { padding-bottom: 50px !important; } .pb-60 { padding-bottom: 60px !important; } .pb-70 { padding-bottom: 70px !important; } .pb-80 { padding-bottom: 80px !important; } .pb-90 { padding-bottom: 90px !important; } .pb-100 { padding-bottom: 100px !important; } .pl-10 { padding-left: 10px !important; } .pl-20 { padding-left: 20px !important; } .pl-30 { padding-left: 30px !important; } .pl-40 { padding-left: 40px !important; } .pl-50 { padding-left: 50px !important; } .pl-60 { padding-left: 60px !important; } .pl-70 { padding-left: 70px !important; } .pl-80 { padding-left: 80px !important; } .pl-90 { padding-left: 90px !important; } .pl-100 { padding-left: 100px !important; } /*-*/ .mh5{min-height:5px !important;} .mh10{min-height:10px !important;} .mh15{min-height:15px !important;} .mh20{min-height:20px !important;} .mh25{min-height:25px !important;} .mh30{min-height:30px !important;} .mh35{min-height:35px !important;} .mh40{min-height:40px !important;} .mh45{min-height:45px !important;} .mh50{min-height:50px !important;} .mh55{min-height:55px !important;} .mh60{min-height:60px !important;} .mh65{min-height:65px !important;} .mh70{min-height:70px !important;} .mh75{min-height:75px !important;} .mh80{min-height:80px !important;} .mh85{min-height:85px !important;} .mh90{min-height:90px !important;} .mh95{min-height:95px !important;} .mh100{min-height:100px !important;} .mh105{min-height:105px !important;} .mh110{min-height:110px !important;} .mh115{min-height:115px !important;} .mh120{min-height:120px !important;} .mh125{min-height:125px !important;} .mh130{min-height:130px !important;} .mh135{min-height:135px !important;} .mh140{min-height:140px !important;} .mh145{min-height:145px !important;} .mh150{min-height:150px !important;} .mh155{min-height:155px !important;} .mh160{min-height:160px !important;} .mh165{min-height:165px !important;} .mh170{min-height:170px !important;} .mh175{min-height:175px !important;} .mh180{min-height:180px !important;} .mh185{min-height:185px !important;} .mh190{min-height:190px !important;} .mh195{min-height:195px !important;} .mh200{min-height:200px !important;} .mh205{min-height:205px !important;} .mh210{min-height:210px !important;} .mh215{min-height:215px !important;} .mh220{min-height:220px !important;} .mh225{min-height:225px !important;} .mh230{min-height:230px !important;} .mh235{min-height:235px !important;} .mh240{min-height:240px !important;} .mh245{min-height:245px !important;} .mh250{min-height:250px !important;} .mh255{min-height:255px !important;} .mh260{min-height:260px !important;} .mh265{min-height:265px !important;} .mh270{min-height:270px !important;} .mh275{min-height:275px !important;} .mh280{min-height:280px !important;} .mh285{min-height:285px !important;} .mh290{min-height:290px !important;} .mh295{min-height:295px !important;} .mh300{min-height:300px !important;} .mh305{min-height:305px !important;} .mh310{min-height:310px !important;} .mh315{min-height:315px !important;} .mh320{min-height:320px !important;} .mh325{min-height:325px !important;} .mh330{min-height:330px !important;} .mh335{min-height:335px !important;} .mh340{min-height:340px !important;} .mh345{min-height:345px !important;} .mh350{min-height:350px !important;} .mh355{min-height:355px !important;} .mh360{min-height:360px !important;} .mh365{min-height:365px !important;} .mh370{min-height:370px !important;} .mh375{min-height:375px !important;} .mh380{min-height:380px !important;} .mh385{min-height:385px !important;} .mh390{min-height:390px !important;} .mh395{min-height:395px !important;} .mh400{min-height:400px !important;} .mh405{min-height:405px !important;} .mh410{min-height:410px !important;} .mh415{min-height:415px !important;} .mh420{min-height:420px !important;} .mh425{min-height:425px !important;} .mh430{min-height:430px !important;} .mh435{min-height:435px !important;} .mh440{min-height:440px !important;} .mh445{min-height:445px !important;} .mh450{min-height:450px !important;} .mh455{min-height:455px !important;} .mh460{min-height:460px !important;} .mh465{min-height:465px !important;} .mh470{min-height:470px !important;} .mh475{min-height:475px !important;} .mh480{min-height:480px !important;} .mh485{min-height:485px !important;} .mh490{min-height:490px !important;} .mh495{min-height:495px !important;} .mh500{min-height:500px !important;} .mh505{min-height:505px !important;} .mh510{min-height:510px !important;} .mh515{min-height:515px !important;} .mh520{min-height:520px !important;} .mh525{min-height:525px !important;} .mh530{min-height:530px !important;} .mh535{min-height:535px !important;} .mh540{min-height:540px !important;} .mh545{min-height:545px !important;} .mh550{min-height:550px !important;} .mh555{min-height:555px !important;} .mh560{min-height:560px !important;} .mh565{min-height:565px !important;} .mh570{min-height:570px !important;} .mh575{min-height:575px !important;} .mh580{min-height:580px !important;} /* ----------------------------------------------- L. MARGIN-PADDING --------------------------------------------- */ /* ----------------------------------------------- M. ACCORDION -------------------------------------------------- */ .faq-more-toggle { position:relative;} .faq-more-accordion, .faq-more-toggle { margin-bottom:15px; /*border: 1px solid rgba(166,172,167,0.6);*/ border-radius: 3px; } .faq-more-toggle:nth-child(1){ margin:10px 0 15px 0;} .faq-more-toggle:last-child { margin-bottom:20px;} /*-------------*/ .faq-more-toggle .faq-more-toggle-trigger { background: #fbfbfb; font:600 14px/24px 'tm-b',sans-serif; color: #020307; text-transform: none; border-radius: 6px; border: 1px solid rgba(166,172,167,0.6); margin: 0; padding:15px 50px 15px 15px; display: block; outline: 0; cursor: pointer; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .faq-more-toggle .faq-more-toggle-trigger:before { font-family:'FontAwesome'; font-size: 13px; content: "\f078"; color:#020307; border-radius:0 6px 6px 0; position:absolute; top:0; right:0; margin:0px 0px 0px 10px; padding:15px 20px; } .faq-more-toggle .faq-more-toggle-trigger:hover, .faq-more-toggle .faq-more-toggle-trigger:hover:before{ color:#17ba60; text-decoration: none; } .faq-more-toggle .faq-more-toggle-container { background-color: rgba(255,255,255); font-size: 14px; color:#020307; border: 1px solid rgba(166,172,167,0.6); padding: 15px; } .faq-more-toggle .faq-more-toggle-trigger.active:before { font-family:'FontAwesome'; font-size: 13px; content: "\f077"; border-radius: 0 6px 0 0; color:#fff; } .faq-more-toggle .faq-more-toggle-trigger.active{ background-color: #17ba60; color:#fff; border-bottom: 1px solid rgba(23,186,96,1); border-radius: 6px 6px 0 0; } .faq-more-toggle .faq-more-toggle-trigger.active + .faq-more-toggle .faq-more-toggle-container{border-radius: 0 0 6px 6px;} /* ----------------------------------------------- M. ACCORDION -------------------------------------------------- */ /* ----------------------------------------------- N. GENERAL ALL/MORE ------------------------------------------- */ .general-all { font: 400 14px/22px "tm-r",sans-serif; margin: 10px; color: #020307; position: relative; bottom: 10px; } .general-all a{ color:#17ba60; text-decoration:none;} .general-all a i { margin-left: 5px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .general-all a:hover{color:#17ba60;} .general-all a:hover i{ color:#17ba60; margin-left: 10px; } /* ----------------------------------------------- N. GENERAL ALL/MORE ------------------------------------------- */ /* ----------------------------------------------- O. MESSAGES/IMPORT/WARNING/SUCCESS ---------------------------- */ .messages-info{ font-family: "tm-b",sans-serif; text-align: left; padding: 20px; margin: 20px 0; border: 1px solid rgba(166,172,167,.6); border-left-width: 5px; border-radius: 3px; } .messages-info h4, .messages-info em, .messages-info span {font-style: normal;display: block;margin: 0px 0 10px 0;padding: 0;} .messages-info h4 { font-weight: 700; font-size: 20px; line-height: 28px; } .messages-info em { font-weight: 700; font-size: 14px; line-height:22px; } .messages-info span { font-weight: 400; font-size:14px; line-height:22px; } /*.messages-info > h4{ }*/ .messages-info > p:last-child { margin-bottom: 0; } .messages-info > code { border-radius: 3px; } .messages-info+.messages-info { margin-top: -5px; } .messages-info-default { border-left-color: #020307; } .messages-info-default > h4 { color: #020307; } .messages-info-default > em { color: #494A4C; } .messages-info-default > span { color: #020307; } .messages-info-primary { border-left-color: #428bca; } .messages-info-primary > h4 { color: #428bca; } .messages-info-primary > em { color: #494A4C; } .messages-info-primary > span { color: #020307; } .messages-info-success { border-left-color: #17ba60; } .messages-info-success > h4 { color: #17ba60; } .messages-info-success > em { color: #494A4C; } .messages-info-success > span { color: #020307; } .messages-info-danger { border-left-color: #F20C0C; } .messages-info-danger > h4 { color: #F20C0C; } .messages-info-danger > em { color: #494A4C; } .messages-info-danger > span { color: #020307; } .messages-info-warning { border-left-color: #F78F20; } .messages-info-warning > h4 { color: #F78F20; } .messages-info-warning > em { color: #494A4C; } .messages-info-warning > span { color: #020307; } .messages-info-info { border-left-color: #5bc0de; } .messages-info-info > h4 { color: #5bc0de; } .messages-info-info > em { color: #494A4C; } .messages-info-info > span { color: #020307; } /* ----------------------------------------------- O. MESSAGES/IMPORT/WARNING/SUCCESS ---------------------------- */ /* ----------------------------------------------- P. PAGINATION ------------------------------------------------- */ .pagination-nav{ font: 700 14px/22px "tm-b",sans-serif; margin:15px 0px; } ul.pagination{ list-style:none; margin: 5px 0; padding-left: 5px; } ul.pagination > li{ list-style-type:none; margin: 5px 0px; padding-left: 5px; float:left; display:block; } ul.pagination > li > a{ border-radius:3px !important;} ul.pagination > li > a, ul.pagination > li > span{ color:#020307; border:1px solid rgba(166,172,167,0.7); border-radius:0; margin:0; padding:12px 20px; } ul.pagination > li.lost-page > a{border: none;} ul.pagination > li.previous-page > a, ul.pagination > li.next-page > a{border-radius:3px;} ul.pagination > li.active-page > a:hover, ul.pagination > li.active-page > a, ul.pagination > li > a:focus, ul.pagination > li > a:hover, ul.pagination > li > span:focus, ul.pagination > li > span:hover{background:#17ba60 !important; color:#fff; border-color:#17ba60;} /* ----------------------------------------------- P. PAGINATION ------------------------------------------------- */ /* ----------------------------------------------- R. HORIZONTAL/ VERTICAL TABS ---------------------------------- */ .tab.tab-bor .tab-content ul { list-style: outside none none; padding-left: 40px; padding-left: 0; } .tab.tab-bor .tab-content ul li, .tab.tab-bor .tab-content ul ul li { margin: 7px 0; } .tab.tab-bor .tab-content ul li::before { font: normal 14px/18px FontAwesome; font-size-adjust: none; font-stretch: normal; font-style: normal; font-variant: normal; content: "\f00c"; display: inline-block; margin: 0 5px 0; color:#17ba60; } .tab.tab-bor .tab-content ul li.disabled { color: rgba(166,172,167,.9); } .tab.tab-bor .tab-content ul li.disabled::before { color:rgba(166,172,167,.9); content: "\f00c"; } /*---------------*/ .tab.tab-bor .tab-content ol { list-style: outside none none; padding-left: 40px; padding-left: 0; } .tab.tab-bor .tab-content ol li, .tab.tab-bor .tab-content ol ol li, .tab.tab-bor .tab-content ol ul li { margin: 7px 0; } .tab.tab-bor .tab-content ol li::before { font: normal 14px/18px FontAwesome; font-size-adjust: none; font-stretch: normal; font-style: normal; font-variant: normal; display: inline-block; margin: 0 5px 0; color:#17ba60; content: "\f068"; text-align: center; vertical-align: middle; } .tab.tab-bor .tab-content ol li.disabled { color: rgba(166,172,167,.9); } .tab.tab-bor .tab-content ol li.disabled::before { color:rgba(166,172,167,.9); content: "\f10c"; } /*-*/ .tab .nav-tabs{width:18%; float: left; display: inline-block; border: none; margin-right:4%;} .tab .nav-tabs li{display: inline-block; width: 100%; padding:0; margin: 0px; text-align: center;} .tab .nav-tabs li a{ border:1px solid rgba(166,172,167,.6); color:#020307; border-bottom:none; background: #fff; padding:10px; border-radius:0; margin:0px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tab .nav-tabs li:last-child a{border-bottom:1px solid rgba(166,172,167,.6);} .tab .nav-tabs li a i{ font-size: 22px; display: inline-block; width: 100%; line-height: normal; } .tab .nav-tabs li a span{font: 700 16px/22px "tm-b",sans-serif; /*color: #020307;*/} .tab .nav-tabs li.active a:before{ position: absolute; margin-top:-25px; content: "\f0da"; font-family: fontawesome; right:-13px; top: 50%; font-size:22px; color: #17ba60; } .tab .nav-tabs li.active a, .tab .nav-tabs li a:hover, .top_dark .nav-tabs li.active a:hover > a:focus{ background:#17ba60; color: #fff; border:1px solid #17ba60; border-bottom:none; position: relative; } /*--------------*/ .tab .tab-content{width:78%; float:left;} .tab .tab-content .img-left{float:left; margin-right:15px; margin-bottom:15px;} .tab .tab-content .img-right{float:right; margin-left:15px; margin-bottom:15px;} .tab .tab-content .title{ font-size:28px; font-weight:500; color:#17ba60; line-height:normal; margin-top:0px; margin-bottom:15px; } .tab .tab-content .list li{margin-bottom:5px;} .tab .tab-content .list li i{margin-right:5px;} .list li i{color:#17ba60;} .tab .tab-content img.img-left { margin-bottom: 0; } /*-------*/ .text-white .tab.tab-default .nav-tabs li a{background:none; color:#f5f5f5;} .text-white .tab.tab-default .nav-tabs li.active a, .text-white .tab.tab-default .nav-tabs li a:hover, .text-white .tab.tab-default .nav-tabs li.active a:hover > a:focus{background:#17ba60;} /*---------*/ .tab.tab-bor{border:1px solid rgba(166,172,167,.6);border-radius: 3px;} .tab.tab-bor .nav-tabs{width:100%; margin:0px;} .tab.tab-bor .nav-tabs li{ margin-right:0; width:auto; /*20%*/ border-bottom:1px solid rgba(166,172,167,.6); border-right:1px solid rgba(166,172,167,.6); background:rgba(166,172,167,.2); } .tab.tab-bor .nav-tabs li:not(.active):last-child{border-bottom-right-radius: 3px;} .tab.tab-bor .nav-tabs li.active:last-child{margin-right:0px; border-right:none;} .tab.tab-bor .nav-tabs li.active{border-bottom:none; background:none;} .tab.tab-bor .nav-tabs li a{ background:none; font: 700 16px/22px "tm-b",sans-serif; border:none; display:table; padding:12px 15px; width:100%; position:relative; } .tab.tab-bor .nav-tabs li a i{font-size: 18px; text-align: right; vertical-align:middle; width:auto; margin-right:10px;} .tab.tab-bor .nav-tabs li a span{text-align:left; vertical-align:middle;} .tab.tab-bor .nav-tabs li a:before, .tab.tab-bor .nav-tabs li a:after{content:normal; margin:0;} .tab.tab-bor .nav-tabs li a:before{ content:""; width:0; height:4px; background:#17ba60; position:absolute; top:-1px; left:50%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tab.tab-bor .nav-tabs li.active a:before{ width:100%; left:0; border-top-left-radius: 2px; border-top-right-radius: 2px; } .tab.tab-bor .nav-tabs li.active a, .tab.tab-bor .nav-tabs li a:hover{color:#17ba60;} .tab.tab-bor .tab-content{width:100%; margin-top:0; padding:15px;} /*-------*/ .text-white .tab.tab-bor .nav-tabs li{background:none;} .text-white .tab.tab-bor .nav-tabs li a{color:#ffffff;} .text-white .tab.tab-bor .nav-tabs li.active a{color:#17ba60;} /*-------------*/ .tab.tab-vertical{border:1px solid rgba(166,172,167,.6); width:100%; overflow:hidden;} .tab.tab-vertical .nav-tabs{ margin-right:0; width:25%; border-bottom:1px solid rgba(166,172,167,.6); position:relative; z-index:9; } .tab.tab-vertical .nav-tabs:before{ background:rgba(166,172,167,.2); border-right:1px solid rgba(166,172,167,.6); display:block; content:""; height:99.8% ; position:absolute; left:0; bottom:-100%; width:100%; z-index:0; } .tab.tab-vertical .nav-tabs li{text-align: left;} .tab.tab-vertical .nav-tabs li a{ background:rgba(166,172,167,.2); font-weight:400; display: inline-block; width: 100%; border: 1px solid rgba(166,172,167,.6); border-left:none; border-bottom:none; padding:10px 15px 10px 20px; } .tab.tab-vertical .nav-tabs li:first-child a{border-top:none;} .tab.tab-vertical .nav-tabs li a i {float: left; width: auto; margin-right: 20px; line-height:42px;} .tab.tab-vertical .nav-tabs li a span{ line-height: 46px;} .tab.tab-vertical .nav-tabs li a::before{ background:#17ba60; content: ""; height: 100%; left: -6px; margin-top: 0; position: absolute; right: inherit; top: 0; width: 5px; opacity: 0; } .tab.tab-vertical .nav-tabs li.active a::before, .tab.tab-vertical .nav-tabs li a:hover:before { left: -1px; opacity: 1; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tab.tab-vertical .nav-tabs li.active a, .tab.tab-vertical .nav-tabs li a:hover, .tab.tab-vertical .nav-tabs li.active a:hover > a:focus{ background:#fff; color: #17ba60; border-right:none; border-bottom:none; position: relative; } .tab.tab-vertical .nav-tabs li.active a{border-top-color:rgba(166,172,167,.6) !important;} .tab.tab-vertical .tab-content{width:75%; padding:10px;} /*----------*/ .tab.tab-light .nav-tabs{ width:100%; margin:0px; margin-bottom:-1px; border-bottom:1px solid rgba(166,172,167,.6); text-align:center; } .tab.tab-light .nav-tabs li{ background:#E4E4E4; border:1px solid rgba(166,172,167,.6); border-bottom:none; border-top-left-radius: 2px; border-top-right-radius: 2px; margin-right:0; width:auto; float:none; margin:0 1px; } .tab.tab-light .nav-tabs li:last-child{margin-right:0px;} .tab.tab-light .nav-tabs li.active{border-bottom:none; background:none;} .tab.tab-light .nav-tabs li a{ font: 500 14px/22px "tm-m",sans-serif; border:none; display:block; background:none; padding:10px 25px; color:#020307; position:relative; } /*--------*/ .only-here.tab.tab-light .nav-tabs li a{padding:8px 12px;} .only-here.tab.tab-light .nav-tabs li a span{font-size:14px;} .only-here.tab.tab-light .tab-content{width:100%; margin-top:40px;} /*--------*/ .tab.tab-light .nav-tabs li a i{display:none;} .tab.tab-light .nav-tabs li a span{text-align:left; vertical-align:middle;} .tab.tab-light .nav-tabs li.active a{color:#17ba60;} .tab.tab-light .nav-tabs li a:before{ content:""; width:0; height:3px; margin:0; background:#17ba60; position:absolute; left:50%; top:-1px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tab.tab-light .nav-tabs li.active a:before{width:100%; left:0; border-top-left-radius: 2px;border-top-right-radius: 2px;} .tab.tab-light .nav-tabs li.active a:after{ content:""; width:100%; height:2px; margin:0; background:#ffffff; position:absolute; left:0; bottom:-2px; } .tab.tab-light .tab-content{width:100%; margin-top:20px;} /*-------*/ .text-white .tab.tab-light .nav-tabs li{background:none;} .text-white .tab.tab-light .nav-tabs li a{color:#ffffff;} .text-white .tab.tab-light .nav-tabs li.active a{color:#17ba60;} .text-white .tab.tab-light .nav-tabs li.active a:after{background:#020307;} /* ----------------------------------------------- R. HORIZONTAL/ VERTICAL TABS ---------------------------------- */ /* ----------------------------------------------- S. TABLES ----------------------------------------------------- */ .table > thead > tr > th, .table.table-striped > thead > tr > th, .table.table-bordered > thead > tr > th, .table.table-hover > thead > tr > th{ font: 700 14px/22px "tm-b",sans-serif; color: #020307; } .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td, .table.table-striped > thead > tr > th, .table.table-striped > tbody > tr > th, .table.table-striped > tfoot > tr > th, .table.table-striped > thead > tr > td, .table.table-striped > tbody > tr > td, .table.table-striped > tfoot > tr > td, .table.table-bordered > thead > tr > th, .table.table-bordered > tbody > tr > th, .table.table-bordered > tfoot > tr > th, .table.table-bordered > thead > tr > td, .table.table-bordered > tbody > tr > td, .table.table-bordered > tfoot > tr > td, .table.table-hover > thead > tr > th, .table.table-hover > tbody > tr > th, .table.table-hover > tfoot > tr > th, .table.table-hover > thead > tr > td, .table.table-hover > tbody > tr > td, .table.table-hover > tfoot > tr > td{ border-top: 1px solid rgba(166,172,167,.6); color: #020307; } .table-benefse { width: 100%; min-width: 526px; max-width: 100%; text-align: left; background: #ffffff; border-collapse: collapse; } .table-benefse th, .table-benefse td { color: #020307; background: #ffffff; } .table-benefse th { padding: 15px 14px; font-size: 14px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; background: #f2f3f8; } @media (max-width: 991.98px) { .table-benefse th { padding-top: 20px; padding-bottom: 20px; } } .table-benefse td { padding: 15px 14px; } .table-benefse tbody tr:first-child td { border-top: 0; } .table-benefse tr td { border-bottom: 1px solid rgba(166,172,167,.6); } .table-benefse tfoot td { font-weight: 700; } .table-benefse-secondary th { color: #17ba60; background-color: #292929; } * + .table-benefse-responsive { margin-top: 30px; } @media (min-width: 768px) { * + .table-benefse-responsive { margin-top: 40px; } } .table-benefse.table-benefse-primary thead th { color: #ffffff; background: #17ba60; border: 0; } .table-benefse.table-benefse-primary tbody tr:hover td { background: #f2f3f8; } .table-benefse.table-benefse-bordered tr td:first-child { border-left: 0; } .table-benefse.table-benefse-bordered tr td:last-child { border-right: 0; } .table-benefse.table-benefse-bordered td { border: 1px solid rgba(166,172,167,.6); } .table-benefse.table-benefse-bordered tbody > tr:first-of-type > td { border-top: 0; } .table-benefse.table-benefse-striped { border-bottom: 1px solid #d9d9d9; } .table-benefse.table-benefse-striped tbody tr:nth-of-type(odd) td { background: transparent; } .table-benefse.table-benefse-striped tbody tr:nth-of-type(even) td { background: #f2f3f8; } .table-benefse.table-benefse-striped tbody td { border: 0; } .table-benefse.table-benefse-striped tfoot td:not(:first-child) { border-left: 0; } @media (max-width: 991.98px) { .table-benefse-responsive { display: block; width: 100%; overflow-x: auto; -ms-overflow-style: -ms-autohiding-scrollbar; } .table-benefse-responsive.table-bordered { border: 0; } } /* ----------------------------------------------- S. TABLES ----------------------------------------------------- */ /* ----------------------------------------------- U. PROGRESS BAR ----------------------------------------------- */ .show-list{ position:relative; top:25px;} #Survey label{ white-space:normal;} #Survey .inline-group .radio{ float:none;} .bg-bar, .bg-bar-one, .bg-bar-two, .bg-bar-three{ background-color:#EBEFF8; width:100%; height:10px; margin:15px 0; display:inline-block; } .bg-bar-one {border-radius: 3px;} .bg-bar-two {border-radius: 6px;} .bg-bar-three {border-radius: 6px; height: 12px;} .progress-bar, .progress-bar-one, .progress-bar-two, .progress-bar-three{ height:100%; padding:0px; background:#0417DA; box-shadow:none; -webkit-transition: width .8s ease; -moz-transition: width .8s ease; -o-transition: width .8s ease; -ms-transition: width .8s ease; transition: width .8s ease; } .progress-bar-one {border-radius: 3px; background: #EB26BB; float: left;} .progress-bar-two {border-radius: 6px; background: #7A107D; float: left;} .progress-bar-three {border-radius: 6px; background: #00A4E8; float: left;} .progress-title{ font: 400 14px/22px "tm-r",sans-serif; color:#020307; position:absolute; text-align:left; margin-left:0; margin-top:-28px; } .progress-title > i{margin-right:8px;} .progress-number, .progress-type{ font: 500 14px/22px "tm-m",sans-serif; color:#020307; float:right; margin-top:-18px; position:relative; top:-10px; } /* ----------------------------------------------- U. PROGRESS BAR ----------------------------------------------- */ /* ----------------------------------------------- V. 404 ERROR -------------------------------------------------- */ .error-404-wrapper{ padding:40px 0px 75px; } .error-404-wrapper h2[err="1"]{ font: 700 165px/172px 'tm-b',sans-serif; color:#17ba60; } .error-404-wrapper h3[err="2"]{ font: 700 38px/42px 'tm-b',sans-serif; color:#020307; margin: 0 0 20px; } .error-404-wrapper h3[err="2"] > span{background-color:#17ba60;color:#FFFFFF;padding:5px 10px;border-radius:3px;} .error-404-wrapper h4[err="3"]{ font: 700 16px/24px 'tm-b',sans-serif; color:#020307; } .error-404-wrapper h5[err="4"]{ width:50%; margin:30px 0; display:inline-block; } /* ----------------------------------------------- V. 404 ERROR -------------------------------------------------- */ /* =============================================== 02. GENERAL =================================================== */ /* =============================================== 03. HEADER ==================================================== */ header{ position: relative; left: 0px; top: 0px; z-index: 999; width: 100%; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; } header.fixed-add{ background: #ffffff none repeat scroll 0 0; min-height: 75px; padding: 0px; position: fixed; top: 0; left: 0; } /* ----------------------------------------------- A. TOP HEADER ------------------------------------------------- */ .top-bar{ position:relative; padding:20px 0px 0; background:#ffffff; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; z-index:5; } /* ----------------------------------------------- A. TOP HEADER ------------------------------------------------- */ /* ----------------------------------------------- B. TOP HEADER INFO -------------------------------------------- */ ul.quick-link{ list-style: outside none none; margin: 0; padding: 0; /*line-height: 40px;*/ } ul.quick-link li{ display: inline-block; padding: 0px; color: #fff; margin-right: 10px; } /*ul.quick-link li:last-child{margin-right: 0;}*/ ul.quick-link li i{ font-size: 28px; color: #17ba60; padding-right: 5px; margin-top: 5px; margin-right: 5px; position: relative; /*vertical-align: 2px;*/ } ul.quick-link li i+div{ display: inline-block; } ul.quick-link li i+div span{ font: 600 15px/20px 'tm-b',sans-serif; color: #020307; display: block } ul.quick-link li i+div span+span{ font:400 14px/20px "tm-r",sans-serif; } .header-top-right{ padding-top: 10px; } .header-top-right a{ font: normal normal 700 12px/20px 'tm-r', sans-serif; color: #fff; letter-spacing: 1px; margin: 0 7px; padding: 0px 10px !important; display: inline-block; transition: all .3s ease-out 0s; position: relative; } .header-top-right a:not(:last-child)::after{ background-color: #17ba60; content: ""; display: block; width: 2px; height: 15px; position: absolute; top: 4px; left: 45px; } .header-top-right a:last-child{ border: none; } .header-top-right a:hover, .header-top-right a:first-child:hover{ color: #17ba60; } .header-top-right a:first-child{ color:#17ba60; } /* ----------------------------------------------- B. TOP HEADER INFO -------------------------------------------- */ /* ----------------------------------------------- C. MENU + LOGO ------------------------------------------------ */ .menu-wrap{ width: 100%; padding: 0px; position: relative; left: 0px; top: 0px; background: none; z-index: 5; } .inside-bg{ background: #062d55; border: 4px solid #ffffff; border-radius: 3px; padding: 0px 10px; margin-bottom: -36px; position: relative; } .menu-logo{} .menu-logo a{ font: normal normal bold 38px/46px 'tm-b', sans-serif; color:#020307; } .menu-logo a:hover, .menu-logo a:active{color:#17ba60;text-decoration: none;} .menu-logo a:hover span{color:#211E20;} .menu-logo a span{color:#17ba60;} /*--------*/ .menu-list { /*position: relative;*/ float: left; } .menu-list a { font: normal normal 600 14px/22px 'tm-b',sans-serif; color: #fff; text-align: center; /*letter-spacing: 1px;*/ display: inline-block; padding: 16px 10px; text-decoration: none; position: relative; transition:all .3s; } .menu-list a::after, .menudown::after { position:absolute; background-color:#17ba60; content:""; left:0; right:0; bottom:-4px; height:4px; width:100%; display:block; -webkit-transition:all .3s; -moz-transition:all .3s; -o-transition:all .3s; transition:all .3s; -ms-transform:rotateY(-90deg); -o-transform:rotateY(-90deg); transform:rotateY(-90deg); } .menu-list a:hover::after, .menudown:hover::after { -webkit-transform:rotateY(0deg); -moz-transform:rotateY(0deg); -ms-transform:rotateY(0deg); -o-transform:rotateY(0deg); transform:rotateY(0deg) } .menu-list a[att="hm"]::after{top: 0;} /*sub list effect position top*/ .menu-list a.active { color:#17ba60; padding: 16px 10px; position: relative; } .menu-list a.active::after { background-color: #17ba60; content: ""; display: block; width: 50px; height: 4px; position: absolute; bottom: -4px; left: 50%; transform: translate(-50%); z-index: 99999; } /*------------------*/ .menu-list .res-icon {display: none;} /*------------------*/ .menudown { position: relative; display: inline-block; } .menudown .dropbtn { background-color: transparent; font: normal normal 600 14px/22px 'tm-r',sans-serif; color: #fff; border: none; outline: none; padding: 16px 10px; margin: 0; transition: all .3s; } .menudown .dropbtn i.fa{margin: 0 0 0 5px;} .menu-list a.active:hover, .menu-list a:hover, .menudown:hover .dropbtn { color: #17ba60 !important; } .xrr{position: relative;display: block;display: none;} /*---------------*/ .menudown-content { background-color: #fff; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; min-width: 245px; display: none; position: absolute; top: 0px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; } .menu-list:not(.responsive) .menudown-content .md-item:first-child::after{ content: ''; position:absolute; left: 5%; top:-15px; border-style: solid; border-width: 0 15px 15px 15px; border-color: transparent transparent #fff transparent; } .menu-list:not(.responsive) .menudown-content .md-item:first-child::before{ content: ''; position:absolute; left: 4.7%; top:-16px; border-style: solid; border-width: 0 16px 16px 16px; border-color: transparent transparent rgba(166,172,167,.6) transparent; } .menu-list:not(.responsive) .menudown-content .md-item:first-child:hover::after{border-color: transparent transparent #17ba60 transparent;} .menudown-content .md-item a{ font: normal normal 600 14px/22px 'tm-r',sans-serif; color: #020307 !important; text-align: left; text-shadow: none; text-decoration: none; border-bottom: 1px solid rgba(166,172,167,.6); float: none; padding: 10px 8px; display: block; } .menudown-content .md-item a:hover {color:#17ba60 !important;} .menudown:hover .xrr, .menudown:hover .menudown-content {display: block;} @media screen and (max-width: 1199px) { .menu-list a, .menudown .dropbtn {display: none;} .menu-list a:not(.res-icon){padding: 15px 12px !important;} .rm-btn{display:block !important;} /*.menu-list a.res-icon { font: normal normal 600 30px/40px 'tm-b',sans-serif; float: right; display: block; padding: 7px 12px; }*/ .menu-list a.active::before{left: 10%;} .menu-list.responsive {position: absolute;float: none;width: 94%;top: 54px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);} /*.menu-list.responsive .res-icon { position: absolute; top:-54px; } .menu-list.responsive a:not(.res-icon) { display: block; text-align: left; width: 100%; }*/ .menu-list.responsive .menudown {float: none;position: relative; display: block;} .menu-list.responsive .menudown-content {position: relative; margin-bottom: 20px; /*max-height: 320px;overflow-y: auto;*/} .xrr::after{ content: ''; position:absolute; left: 5%; top:-15px; border-style: solid; border-width: 0 15px 15px 15px; border-color: transparent transparent #fff transparent; } .xrr::before{ content: ''; position:absolute; left: 4.7%; top:-16px; border-style: solid; border-width: 0 16px 16px 16px; border-color: transparent transparent rgba(166,172,167,.4) transparent; } .menu-list.responsive .menudown .dropbtn { display: block; width: 100%; text-align: left; padding: 15px 10px; } } /*@media screen and (orientation: portrait){ /*tarayıcı genişliği yüksekliğinden küçükse* .menu-list.responsive .menudown-content {max-height: 320px;overflow-y: auto;} } @media screen and (orientation: landscape) { /*and (max-device-width:768px) tarayıcı genişliği yüksekliğinden büyükse* .menu-list.responsive .menudown-content {max-height: 120px;overflow-y: auto;} }*/ /*-------------*/ #test-menu-left {padding: 16px;} .slide-menu { background: #062d55; color: #fff; width: 300px; max-width: 100%; height: 100vh; position: fixed; top: 0; right: 0; display: none; overflow: hidden; box-sizing: border-box; transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; -webkit-transform: translateX(100%); transform: translateX(100%); will-change: transform; z-index: 1000; } .slide-menu .rm-wrap { position: absolute; top: 0; left: 0; width: 100%; transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; -webkit-transform: translateX(0); transform: translateX(0); will-change: transform; } .slide-menu .rm-wrap ul { padding-left: 0; list-style: none; position: relative; width: 300px; max-width: 100%; margin: 0; } .slide-menu .rm-wrap ul ul { position: absolute; top: 0; left: 100%; display: none; } .slide-menu .rm-wrap ul a { color: #fff; border-bottom: 1px solid #0e3863; text-decoration: none; padding: 10px 12px; display: block; } .slide-menu .rm-wrap ul a:hover {color:#17ba60;} .slide-menu .rm-wrap ul a i[class*="angle-left"]{margin:0 8px 0 0;} .slide-menu .rm-wrap ul a i[class*="angle-"]{font-size: 20px;} .slide-menu .rm-wrap ul a i[class*="angle-right"]{margin:0 0 0 8px;float:right;} .slide-menu.no-transition, .slide-menu.no-transition * {transition: none !important;} .slide-menu .rm-wrap {top: 85px;} .slide-menu .controls {overflow: hidden;text-align: center;margin: 10px 0;} /*-------------*/ .rm-social-media{ position: absolute; bottom: 0; width: 100%; padding: 20px 0; } .rm-social-media .social-media ul li a i{ font-size: 14px !important; line-height: 27px !important; width: 24px; height: 24px; } /*-------------*/ .rm-btn { background: none; font: normal normal 600 30px/40px 'tm-b',sans-serif; color: #fff; float: right; display: none; padding: 7px 12px; position: relative; transition:all .3s; } .rm-btn:hover {color: #17ba60 !important;} .rm-btn::after { position:absolute; background-color:#17ba60; content:""; left:0; right:0; bottom:-4px; height:4px; width:100%; display:block; -webkit-transition:all .3s; -moz-transition:all .3s; -o-transition:all .3s; transition:all .3s; -ms-transform:rotateY(-90deg); -o-transform:rotateY(-90deg); transform:rotateY(-90deg); } .rm-btn:hover::after { -webkit-transform:rotateY(0deg); -moz-transform:rotateY(0deg); -ms-transform:rotateY(0deg); -o-transform:rotateY(0deg); transform:rotateY(0deg) } /*------- BEKLET KULLANILMIYOR*/ .slide-menu .btn-controls { background-color: transparent; font: 400 16px/22px "tm-sb",sans-serif; color: #fff; text-align: center; width: 45px; height: 45px; border: 1px solid #0e3863; border-radius: 50%; } .slide-menu .btn-controls:hover { color: #FFF !important; border-color: #FFF !important; -webkit-transition: .8s ease; -moz-transition: .8s ease; -ms-transition: .8s ease; -o-transition: .8s ease; transition: .8s ease; } .slide-menu .btn-controls:hover i { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); color: #FFF; -webkit-transition: .3s ease; -moz-transition: .3s ease; -o-transition: .3s ease; -ms-transition: .3s ease; transition: .3s ease; } /*------- BEKLET KULLANILMIYOR*/ /*------------*/ .btn-controls- { background: none; font:normal normal 400 12px/20px 'tm-r', sans-serif; color: transparent; border: 0; letter-spacing: 1.5px; width: 45px; padding: 10px 5px; position: absolute; top: 15px; left: 52%; box-sizing: border-box; cursor: pointer; outline: none; overflow: hidden; transform: translate(-50%, 0%); transition: all 0.2s ease-in; } .btn-controls-::before, .btn-controls-::after { background-color: #fff; content: ''; display: block; height: 1px; left: 0; position: absolute; transform-origin: center left; transition: all 0.2s ease-in; width: 54.4214px; z-index: -1; } .btn-controls-::before {top: 0;transform: rotate(45deg);} .btn-controls-::after {bottom: 0;transform: rotate(-45deg);} .btn-controls-:hover {color: #17ba60;} .btn-controls-:hover::before, .btn-controls-:hover::after { background: #17ba60; content: ''; width: inherit; height: 1px; position: absolute; left: 0; transition: all .3s ease-in; transform: rotate(0deg); } /*----------------------*/ .top-search .search-form { position: relative; } .top-search.show { top: 100%; opacity: 1; z-index: 9999; } .top-search { background-color:#fff; width: 50%; border-bottom-left-radius:3px; border-bottom-right-radius:3px; padding:20px 15px; position: absolute; top: 100px; right: 0px; opacity: 0; z-index: -99; visibility: hidden; -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); -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; } .top-search:after{ content: ''; position:absolute; right: 20px; top:-13px; border-style: solid; border-width: 0 15px 15px 15px; border-color: transparent transparent #fff transparent; } .top-search:before{ content: ''; position:absolute; right:20px; top:-14px; border-style: solid; border-width: 0 16px 16px 16px; border-color: transparent transparent #fff transparent; } /*----------*/ .quick-nvmenu{position: relative; float: right;} /*=====================================KONTROL EDİLECEK*/ .page-shadow { background:rgba(6,45,85,.5); width:100%; height:100%; position:absolute; top:0; left:0; z-index:4; opacity:0; visibility:hidden; -moz-transition:all .3s ease; -o-transition:all .3s ease; -ms-transition:all .3s ease; transition:all .3s ease } .page-shadow-on { opacity:1; visibility:visible } /*=====================================*/ .quick-nvmenu ul { list-style:none; margin:0; display:inline-block; } .quick-nvmenu ul li { display:inline-block; /*position:relative;*/ } .quick-nvmenu ul li a:not(.account-btn) { padding:5px 15px; cursor: pointer; border-left: 2px solid #17ba60; } .quick-nvmenu ul li:first-child a:not(.account-btn){color: #fff;border: none;} .quick-nvmenu ul li:first-child a:not(.account-btn) i{color: #fff;} .quick-nvmenu ul li .loginmenu{ /* iç içe 2. */ background-color:#FFFFFF; border-bottom-left-radius:3px; border-bottom-right-radius:3px; min-width: 175px; min-height: 75px; padding:12px; display:none; position:absolute; top:100%; right:0; z-index:9999; -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); } .quick-nvmenu ul li .loginmenu:after{ content: ''; position:absolute; left: 45%; top:-13px; border-style: solid; border-width: 0 15px 15px 15px; border-color: transparent transparent #fff transparent; } .quick-nvmenu ul li .loginmenu:before{ content: ''; position:absolute; left: 44.5%; top:-14px; border-style: solid; border-width: 0 16px 16px 16px; border-color: transparent transparent #fff transparent; } .quick-nvmenu ul li:hover .loginmenu{display: block;} .quick-nvmenu ul li a:not(.account-btn):hover{color: #fff;border-color: #fff;} .quick-nvmenu ul li:first-child:hover a:not(.account-btn) i{color: #17ba60;} .quick-nvmenu ul li a:not(.account-btn) i{ font-size: 18px; color: #17ba60; line-height: 54px; width: 19px; opacity:1; float: none; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .quick-nvmenu ul li:hover a:not(.account-btn) i{color: #fff;} /*-----------*/ a.account-btn { background-color:#17ba60; font:normal normal 600 13px/22px 'tm-b',sans-serif; color:#fff; text-align: center; border-radius:2px; width:100%; margin-top:12px; padding:5px 8px; display:block; position: relative; } a.account-btn:hover{background:rgba(23,186,96,.9);} a.account-btn:last-child{background-color: transparent; border: 1px solid rgba(87,90,97,.7); color: #494A4C;} a.account-btn:last-child:hover{color: #17ba60;border-color: #17ba60;} /*-------*/ .top-search .search-form input[type="text"] { background-color: transparent; font-size: 14px; color: rgba(68,68,68,1); border-width:0 0 1px 0; border:1px solid rgba(68,68,68,0.3); border-radius: 3px; padding: 5px 10px; height: 40px; width: 100%; outline: none; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .top-search .search-form i.input-icon { color: rgba(68,68,68,.4); font-size: 18px; text-align: center; line-height: 32px; width: 32px; height: 32px; display: block; position: absolute; top: 5px; right: 10px; z-index: 2; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s; } .top-search .search-form i.input-icon:hover{ cursor:pointer; color:#17ba60; right:0px;} .top-search .search-form input[type="text"]:active, .top-search .search-form input[type="text"]:focus { color:rgba(23,186,96,1) !important; border: 1px solid rgba(23,186,96,1) !important; width:100%; -moz-box-shadow:0px 3px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1); } .top-search .search-form input[type="text"]:focus .input-icon, .top-search .search-form input[type="text"]:active .input-icon, .top-search .search-form input[type="text"]:active + i, .top-search .search-form input[type="text"]:focus + i{color:rgba(23,186,96,0.8); right:0;} .top-search .search-form input[type="text"]:active::-moz-placeholder, .top-search .search-form input[type="text"]:focus::-moz-placeholder { color:rgba(68,68,68,0.7);} /* ----------------------------------------------- C. MENU + LOGO ------------------------------------------------ */ /* =============================================== 03. HEADER ==================================================== */ /* =============================================== 04. MAIN CONTAINER ============================================ */ .headline{ position: relative; z-index: 9; overflow: hidden; } /* ----------------------------------------------- A. SLIDER ----------------------------------------------------- */ .headline-wrapper{border-bottom:4px solid #17ba60;} .slider-wrapper { background-color: #fff; border-bottom:4px solid #17ba60; max-height: 550px !important; width: 100% !important; padding: 0; position: relative; } /* =================================================== * RESETS * ===================================================*/ .flex-container a:hover, .flex-slider a:hover, .flex-container a:focus, .flex-slider a:focus { outline: none; } .slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } .flex-pauseplay span { text-transform: capitalize; } .headline-point, .headline-thumb, .multiple4x-point, .single-point, .multiple2x-point. ,multiple3x-point{ overflow: hidden; margin: 0; padding: 0;} .headline-thumb{ position: relative; zoom: 1;} /*---ortak---*/ .headline-point .slides > li, .headline-thumb .slides > li, .multiple2x-point .slides > li, .multiple3x-point .slides > li, .multiple4x-point .slides > li, .single-point .slides > li{ display: none; -webkit-backface-visibility: hidden; } /*---ortak---*/ .headline-point .slides img, .headline-icons .slides img, .headline-thumb .slides img, .multiple2x-point .slides img, .multiple3x-point .slides img, .multiple4x-point .slides img, .single-point .slides img{ width: 100%; display: block; } /*---ortak---*/ .headline-point .slides:after, .headline-thumb .slides:after, .multiple2x-point .slides:after, .multiple3x-point .slides:after, .multiple4x-point .slides:after, .single-point .slides:after{ height: 0; line-height: 0; content: "\0020"; display: block; clear: both; visibility: hidden; } /*---ortak---*/ html[xmlns] .headline-point .slides, html[xmlns] .headline-thumb .slides, html[xmlns] .multiple2x-point .slides, html[xmlns] .multiple3x-point .slides, html[xmlns] .multiple4x-point .slides, html[xmlns] .single-point .slides{ display: block; } /*---ortak---*/ * html .headline-point .slides, * html .headline-thumb .slides, * html .multiple2x-point .slides, * html .multiple3x-point .slides, * html .multiple4x-point .slides, * html .single-point .slides{ height: 1%; } /*---ortak---*/ .no-js .headline-point .slides > li:first-child, .no-js .headline-thumb .slides > li:first-child, .no-js .multiple2x-point .slides > li:first-child, .no-js .multiple3x-point .slides > li:first-child, .no-js .multiple4x-point .slides > li:first-child, .no-js .single-point .slides > li:first-child{ display: block; } /* ================================================= * DEFAULT THEME * =================================================*/ /*---ortak---*/ .headline-point, .headline-thumb, .multiple2x-point, .multiple3x-point, .multiple4x-point, .single-point{ margin: 0px; /*background: #ffffff;*/ position: relative; zoom: 1; } /*---ortak---*/ .headline-point .slides, .headline-thumb .slides, .multiple2x-point .slides, .multiple3x-point .slides, .multiple4x-point .slides, .single-point .slides{ zoom: 1; } /*---ortak---*/ .headline-point .slides img, .headline-thumb .slides img, .multiple2x-point .slides img, .multiple3x-point .slides img, .multiple4x-point .slides img, .single-point .slides img{ height: auto; } /*---ayrı---*/ .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .headline-thumb.zoom .flex-viewport {border: 1px solid rgba(166,172,167,.6);} .product-wrapper .headline-thumb .flex-viewport {border: 1px solid rgba(166,172,167,.6);border-radius: 3px;} /*---ayrı---*/ .loading .flex-viewport { max-height: 300px; } @-moz-document url-prefix() { .loading .flex-viewport { max-height: none; } } .headline-point ul.slides li, .headline-icons ul.slides li, .headline-thumb ul.slides li { position: relative; } /*------------------------------------*/ .headline-point ul.slides > li::before { content: ""; background:rgba(6,45,85,.3); position: absolute; top: 0; left: 0; right: 0; bottom: 0; } /*---slider icon---*/ .bilge{ position:relative; overflow: hidden;} #carousel.kagan{ width: 100%; margin: 0px; padding: 0 138px; /*background: #ffffff;*/ position: absolute; bottom: 0%; zoom: 1; } .carousel-item { background-color: transparent !important; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); transform: translate3d(0,0,0); /*float: left;*/ } .carousel-item a { color: #fff;} .carousel-item { /*float: left;*/ } .carousel-item figure { text-align: center; padding: 10px 0 20px 0; } .carousel-item figure .fa, .carousel-item figure .l-icon{ font-size: 100px; } .carousel-item figure .fa, .carousel-item figure .l-icon{ font-size: 70px; -moz-transition: all .5s; -o-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; } .carousel-item figure:hover .fa, .carousel-item figure:hover .l-icon{ -moz-transform: scale(1.3); -ms-transform: scale(1.3); -o-transform: scale(1.3); -webkit-transform: scale(1.3); transform: scale(1.3); } .carousel-item figcaption { font: 400 14px/22px "tm-r",sans-serif; white-space: nowrap; text-overflow: ellipsis; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.7); overflow: hidden; width: 100%; } /*---slider icon---*/ /*---ayrı---*/ .carousel li { /*margin-right: 5px;*/ } /*---ayrı---*/ .flex-direction-nav { *height: 0; } .flex-direction-nav a { background: rgba(255,255,255,1); text-shadow: 0 1px 2px rgba(0,0,0,.6); box-shadow: 0 0 10px rgba(2,3,7,.5); text-align: center; color: #494A4C; width: 40px; height: 40px; line-height: 40px; margin: -20px 0 0; /*border: 1px solid rgba(235,234,234,0);*/ border-radius: 50%; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; display: block; cursor: pointer; transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; } .flex-direction-nav a:before { font-family: 'FontAwesome'; font-size: 26px; display: inline-block; content: '\f104'; } /*---sağ-sol ok---*/ .flex-direction-nav a.flex-next:before { content: '\f105'; } .flex-direction-nav .flex-prev { left: -50px; } .flex-direction-nav .flex-next { right: -50px; /*text-align: right;*/ } .headline-thumb:hover .flex-direction-nav .flex-prev, .headline-point:hover .flex-direction-nav .flex-prev, #carousel:hover .flex-direction-nav .flex-prev, .headline-icons:hover .flex-direction-nav .flex-prev, .multiple4x-point:hover .flex-direction-nav .flex-prev, .multiple2x-point:hover .flex-direction-nav .flex-prev, .multiple3x-point:hover .flex-direction-nav .flex-prev, .single-point:hover .flex-direction-nav .flex-prev{ opacity: 0.7; left: 50px; } .headline-thumb:hover .flex-direction-nav .flex-prev:hover, .headline-point:hover .flex-direction-nav .flex-prev:hover, #carousel:hover .flex-direction-nav .flex-prev:hover, .headline-icons:hover .flex-direction-nav .flex-prev:hover, .multiple4x-point:hover .flex-direction-nav .flex-prev:hover, .multiple2x-point:hover .flex-direction-nav .flex-prev:hover, .multiple3x-point:hover .flex-direction-nav .flex-prev:hover, .single-point:hover .flex-direction-nav .flex-prev:hover{ background-color:rgba(255,255,255,1); color: #494A4C; opacity:1; } .headline-thumb:hover .flex-direction-nav .flex-next, .headline-point:hover .flex-direction-nav .flex-next, #carousel:hover .flex-direction-nav .flex-next, .headline-icons:hover .flex-direction-nav .flex-next, .multiple4x-point:hover .flex-direction-nav .flex-next, .multiple2x-point:hover .flex-direction-nav .flex-next, .multiple3x-point:hover .flex-direction-nav .flex-next, .single-point:hover .flex-direction-nav .flex-next{ opacity: 0.7; right: 50px; } .headline-thumb:hover .flex-direction-nav .flex-next:hover, .headline-point:hover .flex-direction-nav .flex-next:hover, #carousel:hover .flex-direction-nav .flex-next:hover, .headline-icons:hover .flex-direction-nav .flex-next:hover, .multiple4x-point:hover .flex-direction-nav .flex-next:hover, .multiple2x-point:hover .flex-direction-nav .flex-next:hover, .multiple3x-point:hover .flex-direction-nav .flex-next:hover, .single-point:hover .flex-direction-nav .flex-next:hover{ opacity: 1; } .flex-direction-nav .flex-disabled { opacity: 0 !important; filter: alpha(opacity=0); cursor: default; } /*---sağ-sol ok---*/ .flex-pauseplay a { color: #020307; width: 20px; height: 20px; position: absolute; left: 10px; bottom: 5px; opacity: 0.8; z-index: 10; display: block; overflow: hidden; cursor: pointer; } .flex-pauseplay a:before { font-size: 20px; display: inline-block; content: '\f004'; } .flex-pauseplay a:hover { opacity: 1; } .flex-pauseplay a.flex-play:before { content: '\f003'; } /*---kontrol-button---*/ .headline-point .flex-control-nav, .multiple4x-point .flex-control-nav, .single-point .flex-control-nav, .multiple2x-point .flex-control-nav, .multiple3x-point .flex-control-nav { text-align: center; width:100%; position: absolute; bottom:15px; z-index: 9; } .single-point .flex-control-nav{bottom: 40px;} /*---özel---*/ .headline-thumb .flex-control-nav {width: 100%; /*position: absolute; bottom: 0;*/ text-align: center; z-index:9;} .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1;} .flex-control-nav li a:hover::after, .flex-control-paging li a.flex-active::after{ border-color: #17ba60; } .flex-control-nav li a::after, .flex-control-paging li a::after{ content: ''; width: 16px; height: 13px; /*border: 1px solid transparent;*/ position: relative; top: -25px; left: -3px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; display: block; } .flex-control-paging li a { background: #494A4C; border-radius:20px; width: 8px; height: 14px; display: block; cursor: pointer; text-indent: -9999px; } .flex-control-paging li a:hover { background: rgba(23,186,96, 1); } .flex-control-paging li a.flex-active { background: rgba(23,186,96, 1); cursor: default; width: 30px; height: 10px; } /*---kontrol-button---*/ .flex-control-thumbs {margin: 10px 0; position: static; overflow: hidden;} .headline-thumb.zoom .flex-control-thumbs li {width: 15%; float: left; margin: 0; padding:0 5px 0 0;} .flex-control-thumbs .flex-active {opacity: 1; cursor: default; border: 1px solid #17ba60 !important;} .headline-thumb .flex-control-thumbs li { width: 10%; float: left; margin: 0 3px; } .flex-control-thumbs img { width: 100%; height: auto; display: block; opacity: .7; cursor: pointer; border: 1px solid #ccc; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .flex-control-thumbs img:hover { opacity: 1; } /*---özel---*/ .headline-thumb.zoom .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer; border: 1px solid rgba(166,172,167,.6);} .headline-thumb.zoom .flex-control-thumbs img:hover {opacity: 1; border: 1px solid #17ba60;} .product-wrapper .flex-control-thumbs img {border: 1px solid rgba(166,172,167,.6);border-radius: 3px;opacity: 1;} .product-wrapper .flex-control-thumbs img:hover{opacity:.7; border: 1px solid #17ba60;} /* ============================================================= * RESPONSIVE * =============================================================*/ @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px;} .flex-direction-nav .flex-next { opacity: 1; right: 10px;} } /*---caption/başlık---*/ .headline-point .flex-caption, .headline-icons .flex-caption, .headline-thumb .flex-caption, .single-point .flex-caption { font: 400 14px/18px 'tm-r', sans-serif; color: #fff; text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,.3); width: 100%; padding: 0px 15px; margin: 0; position: absolute; left: 0; bottom:18%; } .headline-icons .flex-caption{ bottom:30%; } .headline-point .flex-caption h2, .headline-icons .flex-caption h2, /*.headline-thumb .flex-caption h2,*/ .single-point .flex-caption h2 { font: 700 46px/52px "tm-b",sans-serif; color: #fff; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5) ; margin: 0; padding-bottom: 10px; } /*---özel---*/ .headline-thumb .flex-caption{ text-align: left; bottom: 0;} .headline-thumb .flex-caption h3{ font: 600 22px/28px "tm-sb",sans-serif; color: #17ba60; margin: 0; padding-bottom: 5px; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5) ; } .headline-thumb .flex-caption h2 { font: 600 22px/28px "tm-sb",sans-serif; color: #fff; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5) ; margin: 0; padding-bottom: 5px; } .headline-thumb .flex-caption p { font: 400 16px/22px "tm-r",sans-serif; color: #fff; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.7); margin:0 0 5px; } /*------------*/ .headline-point .flex-caption{ text-align: left;} .headline-point .flex-caption h3, .headline-icons .flex-caption h3{ font: 600 46px/52px "tm-sb",sans-serif; color: #17ba60; margin: 0; padding-bottom: 10px; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5) ; } .multiple4x-point .flex-caption p, .headline-point .flex-caption p, .headline-icons .flex-caption p, /*.headline-thumb .flex-caption p,*/ .single-point .flex-caption p { font: 400 20px/26px "tm-r",sans-serif; color: #fff; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.7); margin:0 0 10px; } .multiple4x-point .flex-caption p + p, .headline-point .flex-caption p + p, .headline-icons .flex-caption p + p, .headline-thumb .flex-caption p + p, .single-point .flex-caption p + p{ margin:0;} .multiple4x-point .flex-caption p + p a.more, .headline-point .flex-caption p + p a.more, .headline-icons .flex-caption p + p a.more, .headline-thumb .flex-caption p + p a.more, .single-point .flex-caption p + p a.more { background: #17ba60 none repeat scroll 0 0; font: 600 16px/26px "tm-sb",sans-serif; color: #fff; border: 2px solid #17ba60; border-radius:3px; text-align: center; text-decoration: none; text-shadow: 0 1px rgba(0, 0, 0, 0.15); width:auto !important; height: 40px; min-width:80px; max-width:350px; padding:5px 30px; margin-top: 10px; display: inline-block; position:relative; opacity:1; } a.more span{font: 400 16px/26px "tm-r",sans-serif;} .multiple4x-point .flex-caption p + p a.more:hover, .headline-point .flex-caption p + p a.more:hover, .headline-icons .flex-caption p + p a.more:hover, .headline-thumb .flex-caption p + p a.more:hover, .single-point .flex-caption p + p a.more:hover { background-color: transparent !important; border-color: #17ba60 !important; color: #17ba60; } /* ----------------------------------------------- A. SLIDER ----------------------------------------------------- */ /* ----------------------------------------------- B. SERVICES LIST ---------------------------------------------- */ .services-wrapper{margin:15px 0 35px 0;} .services-wrapper .item-services{margin-bottom: 45px;} .item-services figure{ border-radius: 3px; position:relative; z-index:1; } .text-info { background:#fff; border-radius: 3px; border-bottom:3px solid #17ba60; margin-left:10px; margin-right:10px; padding:20px; position:relative; top:-30px; z-index:2; -webkit-box-shadow:0 2px 10px 0 rgba(0,0,0,.05); box-shadow:0 2px 10px 0 rgba(0,0,0,.05); -webkit-transition:.3s all; transition:.3s all; } .text-info h3 { font: 600 16px/22px "tm-sb",sans-serif; color:#17ba60; margin:0 0 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-info p { color:#494A4C; margin-bottom: 15px; } /*----------------*/ .collect-textwrap { font:normal normal 400 14px/22px "tm-r",sans-serif; color:#020307; margin-bottom:15px; position: relative; display: block; height: calc(3em + 2px); overflow: hidden; white-space: normal; } .collect-textcontainer { word-break: break-all; position: relative; display: block; max-height: 4em; } .collect-ellipsis { background: #fff; position: absolute; right: 0; top: calc(3.2em + 20px - 100%); text-align: left; padding: 0 6px; -webkit-transition:.3s all; transition:.3s all; } /*----------------*/ .text-info h3 + .collect-textwrap + span { display:block; color:#494A4C; } .text-info h3 + .collect-textwrap + span i { color:#494A4C; width:25px; position:relative; top:0px; display:inline-block; zoom:1; } .item-services a:focus, .item-services a:hover { outline:0 } .item-services a:focus .text-info, .item-services a:hover .text-info { background:#17ba60; top:-40px; -webkit-box-shadow:0 2px 20px 0 rgba(0,0,0,.1); box-shadow:0 2px 20px 0 rgba(0,0,0,.1); } .item-services a:focus .text-info h3, .item-services a:hover .text-info h3 { color:#fff; } .item-services a:focus .text-info h3 + .collect-textwrap, .item-services a:hover .text-info h3 + .collect-textwrap { color:rgba(255,255,255,.8); } .item-services a:focus .text-info h3 + .collect-textwrap .collect-ellipsis, .item-services a:hover .text-info h3 + .collect-textwrap .collect-ellipsis{ background-color:#17ba60; } .item-services a:focus .text-info h3 + .collect-textwrap + span, .item-services a:hover .text-info h3 + .collect-textwrap + span { color:rgba(255,255,255,1); } .item-services a:focus .text-info h3 + .collect-textwrap + span i, .item-services a:hover .text-info h3 + .collect-textwrap + span i { color:rgba(255,255,255,1); } /* ----------------------------------------------- B. SERVICES LIST ---------------------------------------------- */ /* ----------------------------------------------- C. COUNTER ---------------------------------------------------- */ section.counter-wrapper { background-color: #eef3f6; padding: 35px 0; margin: 0 0 45px 0; } .count-caption{ font: 600 24px/36px "tm-b",sans-serif; color: #020307; padding: 50px 0 0 40px; position: relative; } .count-caption::before{ background-color: #17ba60; content: ""; display: block; width: 35px; height: 3px; position: absolute; top: 56%; left: 0; } .count-caption span{ background-color: #17ba60; color:#fff; padding: 5px 10px;} .tm-counter { text-align: center; position: relative; } .tm-counter:before { content: ""; position: absolute; width: 1px; height: 85px; top: 10px; right: 0; background-color:rgba(166,172,167,0.6); } .tm-counter:last-child:before {background-color: transparent;} /*.tm-counter:nth-of-type(1):before { content: ""; width: 0; height: 0; }*/ .tm-counter .number-icon i{ font-size: 72px; color: #17ba60; margin: 10px 0; } .tm-counter .number-count { font: 600 36px/46px "tm-sb",sans-serif; color: #17ba60; text-align: center; border: 1px solid rgba(166,172,167,0.6); border-radius: 4px; margin:10px 0 5px; } .tm-counter .name-count { font: 400 14px/20px "tm-r",sans-serif; color: #020307; } /* ----------------------------------------------- C. COUNTER ---------------------------------------------------- */ /* ----------------------------------------------- D. DATA RECOVERY ---------------------------------------------- */ .datarecovery-wrapper{ background: #f9fafa; margin:0 0 35px 0; padding: 0 0 40px 0; } .rv{border-radius: 3px;} .rv.azoom{overflow: hidden;} .rv.azoom img{ box-shadow: 0 0 0 rgba(0, 0, 0, 0); display: block; width: 100%; height: auto; margin: 0; vertical-align: middle; transition: all 0.25s ease 0s; } .rv.azoom img {transition: all 10s ease 0s;} .rv.azoom:hover img {transform: scale(2);} .recovery-info h2, .recovery-info h3{ font: normal normal 600 20px/28px 'tm-b',sans-serif; color: #020307; margin-bottom: 10px; } .recovery-info h3{font-size: 22px;} .recovery-info p{ font: normal normal 400 14px/22px 'tm-r',sans-serif; color: #020307; margin-bottom: 20px; } .rv-column-item { margin-bottom: 20px; position: relative; transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; } .rv-column-item .icon { float: left; padding-right: 10px; } .rv-column-item .icon i { font-size: 24px; color: #17ba60; text-align: center; line-height: 34px; transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; } .rv-column-item h3 { font: normal normal 600 16px/36px 'tm-b',sans-serif; margin-bottom: 5px; } .rv-column-item h3 a {color: #020307;} .rv-column-item h3 a:hover { color: rgba(23,186,96,1); text-decoration: none; } .column-content{color: #020307;} .column-content a{ color:#17ba60; text-decoration:none; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -ms-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .column-content a:hover{ font-weight: bold; } /* ----------------------------------------------- D. DATA RECOVERY ---------------------------------------------- */ /* ----------------------------------------------- E. REFERENCE -------------------------------------------------- */ .quick-wrapper{padding: 0 0 35px 0;margin-bottom:75px;} .inside-reference { background:#fff; margin: 12px 10px 30px; padding: 25px 18px 60px; position: relative; border-radius: 10px; box-shadow: 0 0 15px 0 rgba(0,0,0,.08); } .inside-reference [class*="col-"]:nth-child(odd) .reference { /*text-align: center;*/ border-right:1px solid rgba(166,172,167,0.6); border-bottom: 1px solid rgba(166,172,167,0.6); padding:25px 0px; min-height: 123px; } .inside-reference [class*="col-"]:nth-child(even) .reference { border-right:none; border-bottom: 1px solid rgba(166,172,167,0.6); padding:25px 0px; min-height: 123px; } .inside-reference [class*="col-"]:nth-child(even):last-child .reference, .inside-reference [class*="col-"]:nth-child(odd):nth-last-child(2) .reference{ border-bottom: none; } .inside-reference [class*="col-"]:nth-child(odd) .reference:hover{ border-right:1px solid rgba(23,186,96,1); border-bottom:1px solid rgba(23,186,96,1); color: #17ba60; } .inside-reference [class*="col-"]:nth-child(odd):nth-last-child(2) .reference:hover{ border-right:1px solid rgba(23,186,96,1); border-bottom:none; } .inside-reference [class*="col-"]:nth-child(even):not(:last-child) .reference:hover{ border-bottom:1px solid rgba(23,186,96,1); color: #17ba60; } .reference:hover > h3{color: rgba(87,90,97,1);} .reference:hover h2 a{color: #17ba60;} .reference-icon { margin:0 0 5px 0; display:block; text-align:center; } .reference-icon a > i { font-size:38px; color:#17ba60; text-align:center; float: none; margin: 7px 0 7px 0; } .reference > h2 { font: 700 16px/22px 'tm-b',sans-serif; color: #020307; margin:0 0 5px 0px; text-align:center; } .reference > h2 a{ color:#020307; text-decoration:none; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .reference > h2 a:hover, .reference-icon a:hover i{ color:#17ba60; } .reference > h3{ font: 400 13px/18px 'tm-r',sans-serif; color: rgba(87,90,97,.9); margin:0 0 5px 0px; text-align:center; } .reference div{text-align: center;} .reference div:hover img { transform: translate3d(20px,0,0); } .reference div a img { transition: all .3s ease; will-change: transform; } /* ----------------------------------------------- E. REFERENCE -------------------------------------------------- */ /* ----------------------------------------------- F. IMPORTANT DATES -------------------------------------------- */ .important-wrapper{ background-color:#f2f2f2; position:relative; min-height: 450px; padding:0px; margin: 0 0 45px 0; z-index: 1; } .important-wrapper .image-wrap{ border-radius: 3px; max-width: 364px; max-height: 366px; position:absolute; top: 42px; right:0; overflow: hidden; z-index: 999; } .important-wrapper .image-wrap img{ position:relative; width:100%; display:block; box-shadow: 0 0 0 rgba(0, 0, 0, 0); -webkit-transition: all 0.25s ease 0s; -moz-transition: all 0.25s ease 0s; -ms-transition: all 0.25s ease 0s; -o-transition: all 0.25s ease 0s; transition: all 0.25s ease 0s; } .image-wrap.izoom img { -webkit-transition: all 10s ease 0s; -moz-transition: all 10s ease 0s; -ms-transition: all 10s ease 0s; -o-transition: all 10s ease 0s; transition: all 10s ease 0s; } .image-wrap.izoom:hover img {transform: scale(2);} /*-----------*/ .general-tags { background-color: transparent; width: 100%; height:100%; position:absolute; bottom: 0; overflow: hidden; box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2); } .general-tags:before { background:linear-gradient(to bottom,rgba(6,45,85,0) 0,rgba(6,45,85,0.9) 100%); content:""; position:absolute; width:100%; height:100%; /*opacity:0;*/ -webkit-transition:all .3s; -moz-transition:all .3s; -o-transition:all .3s; transition:all .3s } .general-tags .tags-wrap { text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); color: #fff; padding: 17px 14px 10px; } .general-tags .tags-wrap::before, .general-tags .tags-wrap::after { content: ''; display: table; } .general-tags .tags-wrap::after {clear: both;} .general-tags .tags-wrap div { float: left; font-size: 14px; } .general-tags .tags-wrap ul { margin: 0; padding: 0; list-style-type: none; float: right; } .general-tags .tags-wrap ul li { margin: 0 5px; display: inline-block; position: relative; } .general-tags .tags-wrap ul::before, .general-tags .tags-wrap ul::after { content: ''; display: table; clear: both; } .general-tags .tags-wrap ul a {color: #fff;} .general-tags .tags-wrap ul span { font: 700 12px/20px 'tm-b',sans-serif; position: absolute; top: 0; left: 50%; -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } .general-tags:hover .tags-wrap ul span { -webkit-transform: translate(-50%, -15px); transform: translate(-50%, -15px); opacity: 1; } /*---------*/ .import-info{padding: 43px 20px;} .import-info h3{ font: normal normal 600 22px/28px 'tm-b',sans-serif; color: #020307; margin-bottom: 25px; } .import-info p.text{ font: normal normal 400 14px/22px 'tm-r',sans-serif; color: #020307; margin: 0 0 40px 0; } .import-info h4{ font: normal 400 16px/22px 'tm-r',sans-serif; color: #020307; text-align:right; padding: 0 45px 0 0; position:relative; } .import-info h4:after{ background-color:rgba(166,172,167,1); content:""; display:block; width:35px; height:2px; position:absolute; top:55%; right:0px; } /*--------------*/ .position-static {position: static;} @media (min-width: 992px) { .bg-image-right-lg, .bg-image-left-lg { position: absolute; /*overflow: hidden;*/ top: 0; bottom: 0; /*z-index: -1;*/ } .bg-image-right-lg {right: 0;} .bg-image-left-lg {left: 0; } .bg-image-right-1 {left: 50%;} .bg-image-left-1 { right: 65%; background-color: #17ba60; } } @media (min-width: 3200px) { .bg-image-left-1 {right: 60%;} } @media (min-width: 4800px) { .bg-image-left-1 {right: 55%;} } /* ----------------------------------------------- F. IMPORTANT DATES -------------------------------------------- */ /* ----------------------------------------------- G. RANDOM COMMENTS -------------------------------------------- */ .homecomment-wrapper{margin:0 0 35px 0;padding:0 0 30px 0;} .item-homecomment{ position:relative; margin: 0 0 45px; } .item-homecomment .inner-box{ position:relative; min-height: 190px; padding-left:105px; padding-bottom: 15px; } .item-homecomment .inner-box:before{ content:''; border-right:1px solid rgba(166,172,167,.6); height:160px; position:absolute; top:0px; right:-45px; bottom:30px; } .item-homecomment .inner-box div[hc="1"]{ border-radius:50%; width:90px; height:90px; position:absolute; left:0px; top:0px; overflow:hidden; } .item-homecomment .inner-box div[hc="2"]{ font: 400 14px/22px "tm-r",sans-serif; color: #020307; position:relative; margin-bottom:20px; } .item-homecomment .inner-box div[hc="3"]{ font: 700 14px/22px "tm-b",sans-serif; color: #020307; position:relative; } .item-homecomment .inner-box div[hc="4"]{ font: 400 14px/22px "tm-r",sans-serif; color: #494A4C; position:relative; margin-left:10px; } /* ----------------------------------------------- G. RANDOM COMMENTS -------------------------------------------- */ /* =============================================== 04. MAIN CONTAINER ============================================ */ /* =============================================== 05. CONTAINER ================================================= */ .more-wrapper{ margin: 25px 0; padding: 0; } .more-wrapper .inside-bg { background-color: #fff; width: 100%; } /* ----------------------------------------------- A. MORE TITLE ------------------------------------------------- */ .more-title-wrapper{ background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; padding: 140px 0px 80px; text-align: center; } .more-title-wrapper::before { content: ""; background:rgba(0,0,0,.3); position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .more-title { font:600 30px/36px "tm-b",sans-serif; color:#fff; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); display:inline-block; position:relative; margin: 0 0 15px; padding-bottom: 10px; } .more-title:hover::before {width: 85px;margin-left: -40px;} .more-title:before { background:#17ba60; content:""; width:50px; height:3px; margin-left: -25px; position:absolute; bottom:0; left:50%; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } ul.mtlist { font:normal normal 600 16px/24px 'tm-b', sans-serif; padding: 0px 15px; margin-bottom: 0 !important; position: relative; } ul.mtlist li { color:#fff; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); display:inline-block; } ul.mtlist > li.active { color:#17ba60; } ul.mtlist > li + li::before { color: #fff; content: "/"; display: inline-block; padding: 0 5px; } ul.mtlist > li > a { color: #fff; text-decoration: none; } ul.mtlist li a:hover { color:#17ba60;} ul.mtlist li a i { color: #17ba60; font-size: 16px; margin-right: 5px; } /* ----------------------------------------------- A. MORE TITLE ------------------------------------------------- */ /* ----------------------------------------------- B. SIDEBAR ---------------------------------------------------- */ .sidebar-left { margin-bottom: 40px; padding-bottom: 30px; } @media (max-width: 991px) { .sidebar-left {margin-bottom: 40px;padding-bottom: 30px;} } @media (max-width: 767px) { .sidebar-left {margin-bottom: 40px;padding-bottom: 30px;} } .sidebar-left .widget { padding: 25px 20px; border: 1px solid rgba(166,172,167,0.6); border-radius: 3px; margin-bottom: 30px; } /*----*/ .sidebar-left .widget .widget-title { font: 700 20px/24px 'tm-b',sans-serif; color: #020307; margin-bottom: 10px; padding-bottom: 20px; } .sidebar-left .widget .widget-title::after { background: #17ba60 none repeat scroll 0 0; content: ""; display: block; height: 3px; margin: 10px 0 0 0; width: 25px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sidebar-left .widget .widget-title:hover::after {width: 40px;} /*---------*/ .sidebar-left .widget.widget-social { padding-right: 0; background: #f1f1f1; } .sidebar-left .widget .service-time li { border-bottom: none; font-size: 16px; color: #020307; } .sidebar-left .widget.widget-download { padding: 27px 35px; background: #2f3967; } .sidebar-left .widget.widget-search { padding: 0; border: none; position: relative; } .sidebar-left .widget.widget-search input { padding: 26px 25px; border-radius: 0; font-style: italic; border-color: #eee; color: #020307; } /*---------*/ .sidebar-left .widget.widget-search input::-webkit-input-placeholder { color: #020307; } .sidebar-left .widget.widget-search input:-ms-input-placeholder { color: #020307; } .sidebar-left .widget.widget-search input::-ms-input-placeholder { color: #020307; } .sidebar-left .widget.widget-search input::placeholder { color: #020307; } .sidebar-left .widget.widget-search .input-group-btn i { background: #17ba60; font-size: 18px; color: #fff; width: 55px; height: 55px; line-height: 55px; text-align: center; position: absolute; right: 0; z-index: 999; cursor: pointer; } /*---------*/ .sidebar-left .widget .media {margin-bottom: 15px;} .sidebar-left .widget .media img {width: 80px;height: 70px;border-radius: 3px;} .sidebar-left .widget .media:last-child {margin-bottom: 0;} .sidebar-left .widget .media-body {margin-left: 20px;} .sidebar-left .widget .media-body .n-date a { color: #494A4C; font-size: 13px; display: inline-block; } .sidebar-left .widget .media-body .n-title a { color: #020307; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .sidebar-left .widget .media-body .n-title a:hover { color: #17ba60; } .sidebar-left .widget .media-body .n-title { font-weight: 600; font-size: 14px; line-height: 20px; margin: 0; } /*---------*/ .sidebar-left .widget .widget-archive { list-style: none; margin: 0; padding: 0; } .sidebar-left .widget .widget-archive li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 15px; } .sidebar-left .widget .widget-archive li a { font: normal normal 400 14px/22px 'tm-r',sans-serif; color: #020307; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .sidebar-left .widget .widget-archive li span.a-count{color: #020307;} .sidebar-left .widget .widget-archive li:last-child { margin-bottom: 0; } .sidebar-left .widget .widget-archive li:hover a, .sidebar-left .widget .widget-archive li:hover span { color: #17ba60; } /*---------*/ .sidebar-left .widget.widget-tags ul li { display: inline-block; margin-bottom: 8px; margin-right: 4px; } .sidebar-left .widget.widget-tags ul li a { background: #17ba60; border: 1px solid transparent; border-left: 3px solid rgba(23,186,96,1); border-radius: 3px; display: block; padding: 5px 20px; color: #fff; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .sidebar-left .widget.widget-tags ul li a:hover { background-color: transparent; border-style: solid; border:1px 1px 1px 3px; border-color: rgba(23,186,96,1); color: #17ba60; } .sidebar-left .widget.widget-tags ul li:last-child { margin-bottom: 0; } /*------------*/ .sidebar-right { margin-bottom: 30px; position: relative; } .sidebar-right .field-media img{width: 100%; height: auto;vertical-align: middle;border-radius: 3px 3px 0 0;} .sidebar-right .field-body { color: #020307; border: 1px solid rgba(166,172,167,0.6); border-radius: 0 0 3px 3px; padding: 10px 20px 30px; } .sidebar-right .field-body .field-title { font:normal normal 600 22px/28px "tm-b", sans-serif; margin:0 0 20px 0; } .sidebar-right .field-body .field-title a { color: #020307; -webkit-transition: all ease 500ms; -o-transition: all ease 500ms; transition: all ease 500ms; } .sidebar-right .field-body .field-title a:hover { color: #17ba60; } .field-content{font-size: 14px;} .field-content .inside p{margin: 0 0 20px;} .sidebar-right .field-body .field-content .details { display: block; /*float: right;*/ margin-top: 5px; margin-right: 0; } .sidebar-right .field-body .field-content .details a { margin-right: 0; color: #17ba60; } .sidebar-right .field-body .field-content .details a i { border-radius: 0; border: none; font-size: 16px; margin-left: 5px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .sidebar-right .field-body .field-content .details a:hover i{ color:#17ba60; margin-left: 10px; } /*------------------------*/ .sidebar-right .field-tags { padding-top: 10px; margin-bottom: 20px; } .sidebar-right .field-tags span { margin-right: 10px; padding: 5px 0; display: inline-block; } .sidebar-right .field-tags span a.vote{ /*min-width:35px;*/ margin: 0px; } .sidebar-right .field-tags span i.fa{ -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .sidebar-right .field-tags span .vote i.fa{font-size: 16px;margin-right: 5px;} .sidebar-right .field-tags span a:active, .sidebar-right .field-tags span:hover a, .sidebar-right .field-tags span:hover a:active, .sidebar-right .field-tags span:hover a:active i.fa, .sidebar-right .field-tags span:hover i.fa {color: #17ba60;} .sidebar-right .field-tags a { font:normal normal 400 13px/22px "tm-r",sans-serif; color: #020307; margin:0 5px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } /*----*/ .sidebar-right .field-tags span a.aa.default, .sidebar-right .field-tags span a.aa.plus, .sidebar-right .field-tags span a.aa.minus{ font-size: 13px; font-weight: 700; border: 1px solid rgba(166,172,167,0.6); border-radius: 4px; margin: 0 5px 0 0; padding:5px 11px; cursor: pointer; } .sidebar-right .field-tags span a.aa.default:hover, .sidebar-right .field-tags span a.aa.plus:hover, .sidebar-right .field-tags span a.aa.minus:hover{ background-color: #17ba60; color: #fff; text-decoration: none; border:1px solid #17ba60; cursor: pointer; } .sidebar-right .field-tags span a.aa.disabled{ background-color: #17ba60; color: #fff; font-size: 13px; font-weight: 700; border: 1px solid rgba(23,186,96,1); margin: 0 5px 0 0; padding:5px 11px; cursor: pointer; } /*--------------------*/ .next-previous-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 40px; margin-bottom: 40px; position: relative; } .next-content a, .previous-content a{ -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } .next-previous-content.border-set { border: 1px solid rgba(166,172,167,0.6); border-radius: 3px; } .next-previous-content .previous-content a span i { padding-right: 10px; } .next-previous-content .next-content a span i { padding-left: 5px; } .next-previous-content div { padding: 25px; } .next-previous-content div a h3 { font:normal normal 600 20px/26px 'tm-b', sans-serif; color: #020307; margin-bottom: 15px; } .next-previous-content div a span { font:normal normal 400 16px/24px 'tm-r', sans-serif; color: #020307; } .next-previous-content div:hover a span, .next-previous-content div:hover a span i { color: #17ba60; } .next-previous-content .next-content { text-align: right; } .next-previous-content:after { content: ""; position: absolute; width: 1px; height: 70px; background: rgba(166,172,167,0.6); top: calc(50% - 35px); left: calc(50% - 1px); } /* ----------------------------------------------- B. SIDEBAR ---------------------------------------------------- */ /* ----------------------------------------------- C. MORE TOOLS ------------------------------------------------- */ .post-info {background-color: #fff;} .post-info .info-content {border-color: #e5e7e9;} .post-info .info-content i.fa{font-size: 24px;color: #17ba60;} .post-info .info-content + p{ font:normal normal 400 14px/24px 'tm-r', sans-serif; text-align: center; } .post-info .info-content::before, .post-info .info-content::after {border-color: #e5e7e9;} .post-info .info-text h4.q { font:normal normal 500 20px/32px 'tm-m', sans-serif; letter-spacing: 0; color: #020307; } .post-info-body {padding: 25px 15px;} @media (min-width: 576px) { .post-info .info-text {padding-left: 15px;} } @media (min-width: 768px) { .post-info .info-content {padding: 24px 10px;} .post-info .info-content:before, .post-info .info-content:after {height: 12px;} .post-info .info-content::before { left: 0; width: 100px; } .post-info .info-content::after { width: calc(100% - 105px - 12px); transform: skew(-58deg); } .post-info .info-text h4.q { position: relative; top: -7px; } } .info-content { position: relative; padding: 25px 0; border-top: 1px solid #d7d7d7; } .info-content::before, .info-content::after { content: ''; position: absolute; bottom: 0; height: 13px; border-style: solid; border-color: #d7d7d7; } .info-content::before { left: 0; width: 78px; border-width: 1px 1px 0 0; } .info-content::after { right: 0; width: calc(100% - 78px - 12px); border-width: 1px 0 0 1px; transform-origin: 0 0; transform: skew(-45deg); } .info-text {padding-top: 20px;} @media (min-width: 576px) { .info-content { display: flex; padding: 32px 20px 40px 30px; } .info-text { padding-top: 0; padding-left: 20px; } } @media (min-width: 768px) { .info-content {padding-right: 40px;} } /*---*/ .tools{ padding:5px 0; background:#fff none repeat scroll 0 0;} .tools ul.tools-share { list-style: outside none none; width:100%; margin: 0 0 5px; padding: 10px 0; border-top: 1px solid rgba(166,172,167,0.6); border-bottom: 1px solid rgba(166,172,167,0.6); display: table; } .tools ul.tools-share li { margin: 0 5px 0 0; display: inline-block; } .tools ul.tools-share li a { font: normal normal 400 14px/22px "tm-r",sans-serif; color: #020307; } .tools ul.tools-share li .fa { color: #bababa; margin:0 5px 0; } .tools ul.tools-share li i{ color:rgba(23,186,96,1) !important;} .tools ul.tools-share li a:hover{color:#17ba60;} .tools ul.tools-share li a.aa.default, .tools ul.tools-share li a.aa.plus, .tools ul.tools-share li a.aa.minus{ font-size: 14px; font-weight: 700; border: 1px solid rgba(166,172,167,0.6); border-radius: 4px; margin: 0 5px 0 0; padding:6px 8px 7px; cursor: pointer; } .tools ul.tools-share li a.aa.default:hover, .tools ul.tools-share li a.aa.plus:hover, .tools ul.tools-share li a.aa.minus:hover{ background-color: #17ba60; color: #fff; text-decoration: none; border:1px solid #17ba60; cursor: pointer; } .tools ul.tools-share li a.aa.disabled{ background-color: rgba(166,172,167,0.1); color: #aaa; font-size: 14px; font-weight: 700; border: 1px solid rgba(166,172,167,0.1); margin: 0 5px 0 0; padding:6px 8px 7px; cursor: pointer; } /* ----------------------------------------------- C. MORE TOOLS ------------------------------------------------- */ /* ----------------------------------------------- D. DOWNLOAD FILES --------------------------------------------- */ .download-files {width:100%;} .download-files a { background: #062d55; font: 400 14px/22px "tm-r",sans-serif; color: #17ba60; text-align: left; border-radius: 3px; cursor: pointer; display: inline-block; width: 100%; margin-bottom: 15px; padding: 15px 10px; position: relative; z-index: 9; -webkit-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; -ms-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; } .download-files a:hover { color: rgba(255,255,255); background-color: rgba(23,186,96, 1); } .download-files a i.fa { font-size: 22px; float: right; } /* ----------------------------------------------- D. DOWNLOAD FILES --------------------------------------------- */ /* ----------------------------------------------- E. NEWS COMMENT ----------------------------------------------- */ .comment-form{ margin:25px 0; padding: 20px 0px; } .comments { margin: 25px 0; padding: 30px 0px; } .comments.full{ border: 1px solid rgba(166,172,167,0.6); border-radius: 3px; padding: 20px; } /*------------*/ .comments-head { font: 700 20px/24px 'tm-b',sans-serif; color: #020307; margin-bottom: 10px; padding-bottom: 20px; } .comments-head::after { background: #17BA60 none repeat scroll 0 0; content: ""; display: block; height: 3px; margin: 10px 0 0 0; width: 25px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .comments-head:hover::after {width: 40px;} .comments .comment-detail { margin: 0 0 10px; padding:0px; } .comments .comment-detail span[hm="1"] img { float: left; margin: 0 15px 0 0; opacity:0.5; max-width:100%; border-radius: 50%; } .comments .comment-detail span[hm="2"] {float: right;} .comments .comment-detail span[hm="3"] {font: 700 14px/22px "tm-b",sans-serif; color: #020307;} .comments .comment-detail span[hm="4"] {font: 400 14px/22px "tm-r",sans-serif; color: #494A4C; display: block;} .comments .comment-detail{ width:100%;} .comments .comment-detail a { font: 700 13px/13px "tm-b",sans-serif; /*color:#020307; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; */ } .number-count----- { font: 700 22px/28px "tm-b",sans-serif; color: #17BA60; margin: 10px 0 5px; border: 2px solid #17BA60; border-radius: 10%; padding: 0px 10px; } .comments .comment-detail a.comment-reply { font: 700 12px/20px "tm-b",sans-serif; color: #020307; border: 1px solid rgba(166,172,167,0.7); padding: 5px 15px; margin: 0 0 0 10px; float:right; } .comments .comment-detail a.comment-reply:hover { background-color:rgba(23,186,96, 0.8); color: #fff; border: 1px solid rgba(23,186,96, 0.8); } .comments .comment-detail div:first-of-type { font: 400 12px/12px "tm-r",sans-serif; color: #020307; margin: 14px 0 5px; } .comments .comment-detail a{ font: 700 12px/12px "tm-b",sans-serif; /*color: #020307;*/ } .comments .comment-detail + .comment-body { font: 400 14px/22px "tm-r",sans-serif; color: #020307; margin: 5px 0; } /*-------------*/ .comments ul.sub { list-style:none; margin: 20px 0; padding: 0 0 0 40px; } .comments ul.comment-list{ list-style:none; /*border-bottom: 1px solid rgba(166,172,167,0.6);*/ padding: 15px 0; margin: 20px 0; } .comments ul.comment-list li{ margin:2px 0 12px; position:relative;} .comments ul.comment-list article { border-bottom: 1px solid rgba(166,172,167,0.6); margin-bottom: 0px; } .comments ul.comment-list article::after { background-color:#17BA60; content:""; display:block; height:3px; width:0%; position: absolute; bottom: 0; left: 0; -webkit-transition: width 0.5s; -moz-transition: width 0.5s; -ms-transition: width 0.5s; -o-transition: width 0.5s; transition: width 0.5s; } /*.comments ul.comment-list article::before { background-color:#17BA60; content:""; display:block; height:3px; width:0%; position: absolute; top: 0; right: 0; -webkit-transition: width 0.5s; -moz-transition: width 0.5s; -ms-transition: width 0.5s; -o-transition: width 0.5s; transition: width 0.5s; }*/ .comments ul.comment-list article:hover img{ opacity:1;} .comments ul.comment-list article:hover::after, .comments ul.comment-list article:hover::before {width:100%;} /*-----------*/ .like-dislike { transform:translate3d(0,-10px,0); margin-bottom:-10px; margin-left:-13px; margin-right:-13px; } ul.like-dislike>li { display:inline-block; margin: 0px 0 5px !important; } .like-dislike>* { margin-top:10px; padding-left:13px; padding-right:13px; } .like-dislike i.fa { font-size:16px; color:#020307; margin-right:10px; -webkit-transition: color 0.3s ease-in-out 0s; -moz-transition: color 0.3s ease-in-out 0s; -ms-transition: color 0.3s ease-in-out 0s; -o-transition: color 0.3s ease-in-out 0s; transition: color 0.3s ease-in-out 0s; } .like-dislike a, .like-dislike a:focus, .like-dislike a:active { font: 400 14px/22px "tm-r",sans-serif; color:#020307; } .like-dislike a.active, .like-dislike a:hover, .like-dislike a:hover i{color:#17BA60;} *+.like-dislike {margin-top:25px;} /*---------*/ .other-list { border:1px solid rgba(166,172,167,0.6); border-radius: 3px; width:auto; margin: 0px; padding:5px; } .other-list:hover { border:1px solid rgba(23,186,96,1);} .other-media { background-color: #fff; border-radius: 3px; width: 108px; float: left; position: relative; overflow: hidden; } .other-media img { box-shadow: 0 0 0 rgba(0, 0, 0, 0); display: block; height: auto; width: 100%; vertical-align: middle; transition: all 0.25s ease 0s; } .other-media img {transition: all 10s ease 0s;} .other-media:hover img {transform: scale(2);} .other-info { background: transparent none repeat scroll 0 0; border: medium none; margin-left: 120px; padding: 0; } .other-info h5{ font: 700 16px/22px "tm-b",sans-serif; color:#020307; margin:0 0 8px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .other-info h5 a, .other-info h6 a {color: #020307;display:block;} .other-info h6{ font: 400 14px/22px "tm-r",sans-serif; color:#020307; margin:0; } .other-info h5 a:hover, .other-info h6 a:hover, .other-info h6 a:hover i{ color:#17ba60;} .other-info h6 i { color: #020307; font-size: 14px; line-height:22px; margin-right: 10px; float:left; } /* ----------------------------------------------- E. NEWS COMMENT ----------------------------------------------- */ /* ----------------------------------------------- F. ABOUT ------------------------------------------------------ */ .about-item{ display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap: wrap; margin-bottom: 50px; } .about-item .about-info{ background: #17ba60; border: 1px solid rgba(23,186,96,1); border-radius: 3px; /*width: 100%; height: 100%;*/ padding: 30px; position: relative; top: 51px; bottom: 51px; z-index: 9; } /*--------------------*/ .about-item .about-info{margin-left: -32px;} .about-item:nth-child(2n) .about-info { margin-left: 0px; margin-right: -39px; } /*--------*/ .about-item:nth-child(2n) .direction-2, .about-item .direction-1{ -webkit-order: 1; -ms-flex-order: 1; order: 1; } .about-item:nth-child(2n) .direction-1, .about-item .direction-2{ -webkit-order: 2; -ms-flex-order: 2; order: 2; } /*---------*/ .about-media{ border-radius: 3px; width:100%; position:relative; display: block; max-width: 100%; margin: 0; margin-right: 7px; } .about-item:nth-child(2n) .about-media{ margin: 0; margin-left: 7px; } .about-media{overflow:hidden;} .about-media img{ box-shadow: 0 0 0 rgba(0, 0, 0, 0); display: block; height: auto; margin: 0; width: 100%; -webkit-transition: all 0.25s ease 0s; -moz-transition: all 0.25s ease 0s; -ms-transition: all 0.25s ease 0s; -o-transition: all 0.25s ease 0s; transition: all 0.25s ease 0s; } .about-media.czoom img { -webkit-transition: all 10s ease 0s; -moz-transition: all 10s ease 0s; -ms-transition: all 10s ease 0s; -o-transition: all 10s ease 0s; transition: all 10s ease 0s; } .about-media.czoom:hover img {transform: scale(2);} /*----------*/ .about-info h4, .about-info h5, .about-info div {color: #fff;margin:0 0 10px 0;} .about-info h4 {font: 700 22px/26px "tm-b",sans-serif;} .about-info h4+h5 { font: 400 14px/18px 'tm-r',sans-serif; margin-bottom: 20px; } .about-info h4+h5+div{font:normal normal 400 14px/22px "tm-r",sans-serif;} .about-info a { color: #fff; -webkit-transition: all ease 500ms; -o-transition: all ease 500ms; transition: all ease 500ms; } .about-info h4 a:hover {color: #fff;} /*-----------*/ .himg-wrapper { background-color: transparent; width: 100%; height:100%; position:absolute; bottom: 0; overflow: hidden; box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2); } .himg-wrapper:before { background:linear-gradient(to bottom,rgba(6,45,85,0) 0,rgba(6,45,85,0.9) 100%); content:""; position:absolute; width:100%; height:100%; /*opacity:0;*/ -webkit-transition:all .3s; -moz-transition:all .3s; -o-transition:all .3s; transition:all .3s } .himg-wrapper .tags-wrap { text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); color: #fff; padding: 17px 14px 10px; } .himg-wrapper .tags-wrap::before, .himg-wrapper .tags-wrap::after { content: ''; display: table; } .himg-wrapper .tags-wrap::after {clear: both;} .himg-wrapper .tags-wrap div { float: left; font-size: 14px; } .himg-wrapper .tags-wrap ul { margin: 0; padding: 0; list-style-type: none; float: right; } .himg-wrapper .tags-wrap ul li { margin: 0 5px; display: inline-block; position: relative; } .himg-wrapper .tags-wrap ul::before, .himg-wrapper .tags-wrap ul::after { content: ''; display: table; clear: both; } .himg-wrapper .tags-wrap ul a {color: #fff;} .himg-wrapper .tags-wrap ul span { font: 700 12px/20px 'tm-b',sans-serif; position: absolute; top: 0; left: 50%; -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } .himg-wrapper:hover .tags-wrap ul span { -webkit-transform: translate(-50%, -15px); transform: translate(-50%, -15px); opacity: 1; } .himg-wrapper .firm-data { color: #fff; position: absolute; bottom: 0; width: 100%; -webkit-transform: translateY(calc(-10px + 4em)); transform: translateY(calc(-10px + 4em)); -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; } .himg-wrapper:hover .firm-data { -webkit-transform: translateY(-50px); transform: translateY(-50px); } .himg-wrapper .firm-data .inner-data { padding: 1.5rem 2rem; position: relative; z-index: 1; } .himg-wrapper .firm-data h3 { font: 700 20px/26px "tm-b",sans-serif; color: #17ba60; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); margin-bottom: 10px; position: relative; transition:all 1s ease; } .himg-wrapper .firm-data h3::after{ content: ""; background: #17ba60; border-radius: 3px; width: 5px; height: 18px; position: absolute; top: 4px; left: -10px; display: block; } .himg-wrapper .firm-data h4 { font: 500 18px/22px "tm-m",sans-serif; color:#ffffff !important; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5); margin-bottom: 20px; } .himg-wrapper .firm-data h4 a{color: #fff;} /* ----------------------------------------------- F. ABOUT ------------------------------------------------------ */ /* ----------------------------------------------- G. PAGE CONTACT ----------------------------------------------- */ .contact-wrapper{padding: 40px 0 0;} .contact-maps{min-height: 450px;padding-top: 60px;} .page-contact { background-color: #fff; /*padding:0;*/ } .page-contact .contact-title{text-align: center;} .page-contact .contact-title h3 { font: 700 28px/36px 'tm-b',sans-serif; color: #020307; margin: 0 0 10px 0; padding: 0; position:relative; display:inline-block; } .page-contact .contact-title h3:after{ position: absolute; content: ''; left: 100%; margin-left:10px; width: 40px; height: 2px; bottom: 8px; background-color: #17ba60; } .page-contact .contact-title p { font: 500 14px/22px 'tm-m',sans-serif; color: #020307; margin: 0 0 20px 0; padding: 0; } .page-contact.contact-message {padding-bottom:0} .page-contact #map { border-top: 4px solid #17ba60; width:100%; height:500px; } .page-contact .contact-block {margin-top:-70px} .page-contact .contact-block .contact-message {padding:60px 25px} .page-contact .contact-block .contact-info { background-color:#fff; padding-bottom:30px; box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1); border-radius: 3px; } .page-contact .contact-block .contact-info figure { font: 400 14px/22px "tm-r",sans-serif; padding:15px; } .page-contact .contact-block .contact-info figure figcaption>strong { font-weight: bold; display:block; padding:7.5px 0; } .page-contact .contact-block .contact-info figure figcaption>span { font-weight: normal; font-size: 13px; } .page-contact .contact-block .contact-info figure span.fa { font-size:50px; color:#17ba60; } .page-contact .contact-block .contact-form { display:none; margin-top:50px; } .page-contact .contact-block .contact-form .form-control { border-color:transparent } .map-info-window .fa { width:20px; text-align:center; margin-right:3px; display:inline-block; } /*-------------*/ .address-wrapper{ margin:0 0 50px 0;} .address-wrapper .add-item{ margin: 0px 0 25px; transition: 1s all; -webkit-transition: 1s all; -moz-transition: 1s all; -o-transition: 1s all; -ms-transition: 1s all; } .address-wrapper .add-item:last-child{margin-bottom: 0;} .address-wrapper .add-item:hover {color: #17ba60;} .address-wrapper .add-item:hover .add-effect span:before { -webkit-transform: scale(1); transform: scale(1); } .address-wrapper .add-item:hover .add-effect i.fa{ color:#17ba60;border-color: #17ba60;} .address-wrapper .add-item:hover .ftext h4, .address-wrapper .add-item:hover .ftext p{ color:#17ba60;} .address-wrapper .add-item .fa { font-size: 28px; color:#fff; border: 1px solid rgba(23,186,96,1); border-radius: 3px; width: 60px; height: 60px; text-align: center; line-height: 60px; } .address-wrapper .add-item .ftext{display: table-cell;} .address-wrapper .add-item .ftext h4{ font: 700 14px/24px 'tm-b',sans-serif; color:#020307; text-align:left; margin: 0; } .address-wrapper .add-item .ftext p{ font: 400 14px/20px 'tm-r',sans-serif; color:#020307; } /*--------*/ .add-effect{ display:table-cell; vertical-align: top; padding-right: 10px; } .add-effect span{ background-color: #17ba60; border-radius: 3px; display: inline-block; position: relative; box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .add-effect span:before { background:#fff; content: ""; position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0; -webkit-transform: scale(0); transform: scale(0); -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .add-effect:hover, .add-effect:focus, .add-effect:active { color: #17ba60; } .add-effect:hover:before, .add-effect:focus:before, .add-effect:active:before { -webkit-transform: scale(1); transform: scale(1); } .add-effect:hover i.fa{ color:#17ba60;} /*------------------*/ .contact-form-wrapper{} .contact-form-wrapper a.es-animated-button{display:inline-block;} .special-frm label { display: inline-block; max-width: 100%; margin-bottom: 20px; } .special-frm .label { font: 500 14px/22px "tm-m",sans-serif; text-align:left; color:#e1e1e1; display: block; padding:3px 2px; margin-bottom: 5px; } .special-frm .input, .special-frm .select, .special-frm .textarea, .special-frm .radio, .special-frm .checkbox{ position: relative; display: block; } .special-frm .select:hover select{ cursor:pointer; } .special-frm .select select{background-color: #fff !important;color: #020307 !important;} .special-frm .select i { position: absolute; top: 14px; right: 8px; width: 5px; height: 11px; background: #fff; box-shadow: 0 0 0 5px #fff; } .special-frm .select i:after, .special-frm .select i:before { content: ''; position: absolute; right: 0; border-right: 4px solid transparent; border-left: 4px solid transparent; } .special-frm .select i:after { bottom: 0; border-top: 4px solid #404040; } .special-frm .select i:before { top: 0; border-bottom: 4px solid #404040; } .special-frm .select-multiple select { height: auto; } .special-frm .input input, .special-frm .select select, .special-frm .textarea textarea { background: transparent; font: 400 14px/22px 'tm-r',sans-serif; color: 020307; border-width: 1px; border-style: solid; border-radius: 3px; width: 100%; height: 45px; padding: 10px; display: block; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; appearance: normal; -moz-appearance: none; -webkit-appearance: none; } .special-frm .input input, .special-frm .select select, .special-frm .textarea textarea, .special-frm .radio i, .special-frm .checkbox i{ border-color: rgba(166,172,167,0.8); transition: border-color 0.3s; -o-transition: border-color 0.3s; -ms-transition: border-color 0.3s; -moz-transition: border-color 0.3s; -webkit-transition: border-color 0.3s; } .special-frm .input:hover input, .special-frm .select:hover select, .special-frm .textarea:hover textarea, .special-frm .radio:hover i, .special-frm .checkbox:hover i{ border-color: #17ba60; } .special-frm .input input:focus, .special-frm .select select:focus, .special-frm .textarea textarea:focus, .special-frm .radio input:focus + i, .special-frm .checkbox input:focus + i{ border-color: #17ba60; } .special-frm .input input::-moz-placeholder, .special-frm .select select::-moz-placeholder, .special-frm .textarea textarea::-moz-placeholder{ font: 400 14px/22px 'tm-r',sans-serif; color:rgba(87,90,97,1); } .special-frm .input input:focus::-moz-placeholder,.special-frm .input input:active::-moz-placeholder, .special-frm .select select:focus::-moz-placeholder,.special-frm .select select:active::-moz-placeholder, .special-frm .textarea textarea:focus::-moz-placeholder,.special-frm .textarea textarea:active::-moz-placeholder{ font: 400 14px/22px 'tm-r',sans-serif; color:rgba(87,90,97,1); } .special-frm .radio input + i:after {background-color: #17BA60;} .special-frm .checkbox input + i:after {color: #17BA60;} .special-frm .radio input:checked + i, .special-frm .checkbox input:checked + i, .special-frm .toggle input:checked + i { border-color: #17BA60; } .special-frm .rating input:checked ~ label {color: #17BA60;} .special-frm .textarea textarea { height: auto; resize: none; } .special-frm .textarea-expandable textarea { height: 45px; } .special-frm .textarea-expandable textarea:focus { height: auto; } .special-frm .textarea textarea{resize: none;} .special-frm .radio, .special-frm .checkbox { margin-bottom: 4px; padding-left: 27px; font-size: 15px; line-height: 27px; color: #404040; cursor: pointer; } .special-frm .radio:last-child, .special-frm .checkbox:last-child { margin-bottom: 0; } .special-frm .radio input, .special-frm .checkbox input { position: absolute; left: -9999px; } .special-frm .radio i, .special-frm .checkbox i { background: #fff; border-width: 1px; border-style: solid; border-radius: 3px; width: 17px; height: 17px; position: absolute; top: 5px; left: 0; display: block; outline: none; } .special-frm .radio i { border-radius: 50%; } .special-frm .radio input + i:after, .special-frm .checkbox input + i:after { position: absolute; opacity: 0; transition: opacity 0.1s; -o-transition: opacity 0.1s; -ms-transition: opacity 0.1s; -moz-transition: opacity 0.1s; -webkit-transition: opacity 0.1s; } .special-frm .radio input + i:after { content: ''; top: 5px; left: 5px; width: 5px; height: 5px; border-radius: 50%; } .special-frm .checkbox input + i:after { font: normal 12px/16px FontAwesome; text-align: center; content: '\f00c'; top: 0px; left: 0px; width: 15px; height: 15px; } .special-frm .radio input:checked + i:after, .special-frm .checkbox input:checked + i:after { opacity: 1; } .special-frm .inline-group { margin: 0 -30px 20px 0; } .special-frm .inline-group:after { content: ''; display: table; clear: both; } .special-frm .inline-group .radio, .special-frm .inline-group .checkbox { float: left; margin-right: 30px; } .special-frm .inline-group .radio:last-child, .special-frm .inline-group .checkbox:last-child { margin-bottom: 4px; } .special-frm .inline-group .radio, .special-frm .inline-group .checkbox{ margin-top: 0px; } /*-------------------*/ .special-frm .tooltip { background: rgba(0,0,0,0.9); font-size: 11px; line-height: 16px; font-weight: 400; color: #fff; border-radius: 2px; position: absolute; left: -9999px; z-index: 1; padding: 2px 8px 3px; opacity: 0; transition: margin 0.3s, opacity 0.3s; -o-transition: margin 0.3s, opacity 0.3s; -ms-transition: margin 0.3s, opacity 0.3s; -moz-transition: margin 0.3s, opacity 0.3s; -webkit-transition: margin 0.3s, opacity 0.3s; } .special-frm .tooltip:after { content: ''; position: absolute; } .special-frm .input input:focus + .tooltip, .special-frm .textarea textarea:focus + .tooltip { opacity: 1; } .special-frm .tooltip-top-right { bottom: 100%; margin-bottom: 15px; } .special-frm .tooltip-top-right:after { top: 100%; right: 16px; border-top: 4px solid rgba(0,0,0,0.9); border-right: 4px solid transparent; border-left: 4px solid transparent; } .special-frm .input input:focus + .tooltip-top-right, .special-frm .textarea textarea:focus + .tooltip-top-right { right: 0; left: auto; margin-bottom: 5px; } .special-frm .tooltip-top-left { bottom: 100%; margin-bottom: 15px; } .special-frm .tooltip-top-left:after { top: 100%; left: 16px; border-top: 4px solid rgba(0,0,0,0.9); border-right: 4px solid transparent; border-left: 4px solid transparent; } .special-frm .input input:focus + .tooltip-top-left, .special-frm .textarea textarea:focus + .tooltip-top-left { right: auto; left: 0; margin-bottom: 5px; } .special-frm .tooltip-right { top: 9px; white-space: nowrap; margin-left: 15px; } .special-frm .tooltip-right:after { top: 6px; right: 100%; border-top: 4px solid transparent; border-right: 4px solid rgba(0,0,0,0.9); border-bottom: 4px solid transparent; } .special-frm .input input:focus + .tooltip-right, .special-frm .textarea textarea:focus + .tooltip-right { left: 100%; margin-left: 5px; } .special-frm .tooltip-left { top: 9px; white-space: nowrap; margin-right: 15px; } .special-frm .tooltip-left:after { top: 6px; left: 100%; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid rgba(0,0,0,0.9); } .special-frm .input input:focus + .tooltip-left, .special-frm .textarea textarea:focus + .tooltip-left { right: 100%; left: auto; margin-right: 5px; } .special-frm .tooltip-bottom-right { top: 100%; margin-top: 15px; } .special-frm .tooltip-bottom-right:after { bottom: 100%; right: 16px; border-right: 4px solid transparent; border-bottom: 4px solid rgba(0,0,0,0.9); border-left: 4px solid transparent; } .special-frm .input input:focus + .tooltip-bottom-right, .special-frm .textarea textarea:focus + .tooltip-bottom-right { right: 0; left: auto; margin-top: 5px; } .special-frm .tooltip-bottom-left { top: 100%; margin-top: 15px; } .special-frm .tooltip-bottom-left:after { bottom: 100%; left: 16px; border-right: 4px solid transparent; border-bottom: 4px solid rgba(0,0,0,0.9); border-left: 4px solid transparent; } .special-frm .input input:focus + .tooltip-bottom-left, .special-frm .textarea textarea:focus + .tooltip-bottom-left { right: auto; left: 0; margin-top: 5px; } /* ----------------------------------------------- G. PAGE CONTACT ----------------------------------------------- */ /* ----------------------------------------------- H. MEDIA ------------------------------------------------------ */ .media-wrap{ font-family: 'tm-r', sans-serif; border:1px solid rgba(166,172,167,.6); border-radius: 3px; position:relative; } .media-wrap .media-info{ width:50%;padding:15px;float:left;} .media-wrap .media-info h4, .media-wrap .media-tags, .media-wrap .media-content{margin-bottom:10px;} .media-wrap .media-info h4 { font: 700 18px/24px "tm-b",sans-serif; color: #020307; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .media-wrap .media-info h4 a { color: #020307; -webkit-transition: all ease 500ms; -o-transition: all ease 500ms; transition: all ease 500ms; } .media-wrap .media-info h4 a:hover {color: #17ba60;} .media-tags > span{ font: normal normal 400 13px/22px "tm-r",sans-serif; display: inline-block; margin-right: 10px; transition: 0.3s ease-in-out; } .media-tags > span i { padding-right: 5px; transition: 0.3s ease-in-out; } .media-tags > span:hover, .media-tags > span:hover i.fa {color: #17ba60;} .media-wrap .media-tags{margin-bottom:15px;color:#494A4C; } .media-wrap .media-tags a{font-size:14px; font-weight:400; margin-right:10px;} .media-wrap .media-tags a:hover{color:#17ba60;} .media-wrap .media-tags a .fa{color:#17ba60; padding-right:8px;} .media-wrap .media-content{color: #020307;} .media-wrap .media-image{ border-radius: 3px 0 0 3px; width:50%; float:left; position:relative; } .media-wrap .media-image img { width: 100%; height: auto; vertical-align: middle; /*border-radius: 3px 0 0 3px;*/ } .media-wrap .media-image.azoom{overflow: hidden;} .media-wrap .media-image.azoom img{ box-shadow: 0 0 0 rgba(0, 0, 0, 0); display: block; width: 100%; height: auto; margin: 0; vertical-align: middle; transition: all 0.25s ease 0s; } .media-wrap .media-image.azoom img {transition: all 10s ease 0s;} .media-wrap .media-image.azoom:hover img {transform: scale(2);} .media-wrap .media-info a.btn-more{ color:#17ba60; text-align: right; display: block; text-decoration:none; transition:all 0.3s ease-out 0s; } .media-wrap .media-info a:hover{color:rgba(23,186,96,1);} .media-wrap .media-info a.btn-more i { border-radius: 0; border: none; font-size: 16px; margin-left: 5px; transition: all 0.2s ease-in-out 0s; } .media-wrap .media-info a.btn-more:hover i{ color:#17ba60; margin-left: 10px; } /* ----------------------------------------------- H. MEDIA ------------------------------------------------------ */ /* ----------------------------------------------- I. MEDIA MORE ------------------------------------------------- */ .sidebar-media-left { border-right:1px solid rgba(166,172,167,.6); min-height:100%; padding-right:25px; margin-bottom: 30px; position: relative; } .sidebar-media-left .fm-image img{ width: 100%; height: auto; vertical-align: middle; border-radius: 3px; } .sidebar-media-left .fm-body {padding: 10px 0px 30px;color: #020307;} .sidebar-media-left .fm-body .fm-title { font:normal normal 700 22px/28px 'tm-b', sans-serif; margin:0 0 20px 0; padding-top: 32px; } .sidebar-media-left .fm-body .fm-title a { color: #020307; -webkit-transition: all ease 500ms; -o-transition: all ease 500ms; transition: all ease 500ms; } .sidebar-media-left .fm-body .fm-title a:hover { color: #17ba60; } .fm-content{font-size: 14px;} .fm-content .inside p{margin: 0 0 20px;} .sidebar-media-left .fm-body .fm-content .details { display: block; /*float: right;*/ margin-top: 5px; margin-right: 0; } .sidebar-media-left .fm-body .fm-content .details a { margin-right: 0; color: #17ba60; } .sidebar-media-left .fm-body .fm-content .details a i { border-radius: 0; border: none; font-size: 16px; margin-left: 5px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .sidebar-media-left .fm-body .fm-content .details a:hover i{ color:#17ba60; margin-left: 10px; } /*----------*/ .sidebar-media-left .fm-tags { border-bottom:1px solid rgba(166,172,167,.6); padding: 8px 0 15px; /*margin-bottom: 20px;*/ } span[class*="vr-"]:not([title]), span[class*="vrr-"]:not([title]) { margin-right: 10px; padding: 5px 0; display: inline-block; } .sidebar-media-left .fm-tags span em{font-style: normal;} .sidebar-media-left .fm-tags span .vote i.fa { font-size: 16px; margin-right: 5px; } .sidebar-media-left .fm-tags span i.fa{ -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .sidebar-media-left .fm-tags span:hover a, .sidebar-media-left .fm-tags span:hover i.fa {color: #17ba60;} .sidebar-media-left .fm-tags a { font:normal normal 400 13px/22px "tm-r",sans-serif; color: #020307; margin:0 5px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } /*----*/ .sidebar-media-left .fm-tags span a.aa.default, .sidebar-media-left .fm-tags span a.aa.plus, .sidebar-media-left .fm-tags span a.aa.minus{ font-size: 13px; font-weight: 700; border: 1px solid rgba(166,172,167,0.6); border-radius: 4px; margin: 0 5px 0 0; padding:5px 11px; cursor: pointer; } .sidebar-media-left .fm-tags span a.aa.default:hover, .sidebar-media-left .fm-tags span a.aa.plus:hover, .sidebar-media-left .fm-tags span a.aa.minus:hover{ background-color: #17ba60; color: #fff; text-decoration: none; border:1px solid #17ba60; cursor: pointer; } .sidebar-media-left .fm-tags span a.aa.disabled{ background-color: #17ba60; color: #fff; font-size: 13px; font-weight: 700; border: 1px solid rgba(23,186,96,1); margin: 0 5px 0 0; padding:5px 11px; cursor: pointer; } /*---------*/ .sidebar-media-right ul.mw-tags li { display: inline-block; margin-bottom: 8px; margin-right: 4px; } .sidebar-media-right ul.mw-tags li a { border: 1px solid rgba(166,172,167,6); border-left: 3px solid rgba(166,172,167,1); border-radius: 3px; display: block; padding: 5px 20px; color: #494A4C; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .sidebar-media-right ul.mw-tags li a:hover { background-color: rgba(23,186,96,.8); border-style: solid; border:1px 1px 1px 3px; border-color: #17ba60; color: #fff; } .sidebar-media-right ul.mw-tags li:last-child {margin-bottom: 0;} /*------------------*/ .sidebar-media-right { margin-bottom: 30px; position: relative; } .sidebar-media-right .media-widget { padding: 15px 0px; margin-bottom: 30px; } .sidebar-media-right .media-widget:first-child {padding: 5px 0px;} /*----*/ .sidebar-media-right .media-widget h3.mw-title { font: 700 20px/24px 'tm-b',sans-serif; color: #020307; margin-bottom: 10px; padding-bottom: 20px; } .sidebar-media-right .media-widget h3.mw-title::after { background: #17ba60 none repeat scroll 0 0; content: ""; display: block; height: 3px; margin: 10px 0 0 0; width: 25px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sidebar-media-right .media-widget h3.mw-title:hover::after {width: 40px;} /*--------------*/ ul.list-category { display:block; } ul.list-category li a { font: normal normal 400 14px/22px 'tm-r',sans-serif; position:relative; display:block; padding:10px 0; border-bottom:1px solid rgba(166,172,167,.6); } ul.list-category li a, ul.list-category li a:focus, ul.list-category li a:active { color: #020307; } ul.list-category li a:hover { color: #17ba60; } ul.list-category li a::before { position:absolute; content:''; bottom:-1px; left:0; height:3px; width:0; background:#17ba60; transition:all .3s ease } ul.list-category li a.active::before {width:50px} ul.list-category li a:hover:not(.active)::before {width:100%;} /* ----------------------------------------------- I. MEDIA MORE ------------------------------------------------- */ /* ----------------------------------------------- J. PRODUCT CATEGORY ------------------------------------------- */ .product-wrapper {padding: 25px 0 80px 0;} .product-left-sidebar { border: 1px solid rgba(166,172,167,.6); border-radius: 3px; padding: 15px 0px; margin-bottom: 35px; } /*-----------*/ .filter-widget{margin:0 0 25px;} .filter-widget:last-child{margin:0;} .filter-widget .filter-content {padding: 10px;} h3.filter-title { font: normal normal 700 18px/22px 'tm-b',sans-serif; color: #020307; position:relative; display:block; padding:10px; border-bottom:1px solid rgba(166,172,167,.6); } h3.filter-title:hover {color: #17ba60;} h3.filter-title::before { position:absolute; content:''; bottom:-1px; left:0; height:3px; width:0; background:#17ba60; transition:all .3s ease } h3.filter-title::after { content: ''; border-radius: 0 3px 3px 0; position: absolute; bottom: 19px; left: 0; height: 3px; width: 7px; background: #17ba60; transition: all .3s ease; } h3.filter-title:hover::before {width:100%;} /*----------*/ a.filter-btn{ background: #17ba60 none repeat scroll 0 0; font: 600 16px/26px "tm-sb",sans-serif; color: #fff; border: 2px solid #17ba60; border-radius:3px; text-align: center; text-decoration: none; width:auto; height: 40px; padding:5px 30px; display: block; } a.filter-btn i.fa{margin: 0 7px;} a.filter-btn:hover { background-color: #062d55 !important; border-color: #062d55 !important; color: #fff; } /*--------------*/ ul.category-list { list-style: none; margin: 0; padding: 0; } ul.category-list li { color:#020307; margin:0px; padding: 8px 0; box-shadow: 0 0 1px transparent; transform: translateZ(0px); transition-duration: 0.3s; transition-property: transform; transition-timing-function: ease-out; } ul.category-list li:hover { transform:translateX(8px); } ul.category-list i { color: #020307; font-size: 16px; margin-right: 5px; } ul.category-list a {color: #020307;} ul.category-list a:hover, .category-list a:hover i{color: #17ba60;} .category-list a.active, .category-list a.active .categoriy-count{color: #17ba60;} .categoriy-count { color: rgba(166,172,167,1); float: right; } /*------------OTHER PRODUCT*/ .other-sidebar { border: 1px solid rgba(166,172,167,.6); border-radius: 3px; padding: 15px 0px; margin: 35px 0; } .other-widget{margin:0 0 25px;} .other-widget:last-child{margin:0;} .other-widget .other-content {/*padding: 10px;*/} h3.other-title { font: normal normal 700 18px/22px 'tm-b',sans-serif; color: #020307; position:relative; display:block; padding:10px; border-bottom:1px solid rgba(166,172,167,.6); } h3.other-title:hover {color: #17ba60;} h3.other-title::before { position:absolute; content:''; bottom:-1px; left:0; height:3px; width:0; background:#17ba60; transition:all .3s ease } h3.other-title::after { content: ''; border-radius: 0 3px 3px 0; position: absolute; bottom: 19px; left: 0; height: 3px; width: 7px; background: #17ba60; transition: all .3s ease; } h3.other-title:hover::before {width:100%;} ul.bestselling { margin-top: 15px; padding: 0; list-style: none; line-height: normal; } ul.bestselling li { border-bottom:1px solid rgba(166,172,167,.6); margin-bottom: 15px; padding: 10px; } ul.bestselling li:hover .bestselling-body span:nth-child(4){background-color:#062d55;} ul.bestselling li:last-child{margin-bottom:0;border: none;} ul.bestselling li .bs-img { text-align:center; border: 1px solid rgba(166,172,167,.6); border-radius: 3px; width: 85px; height: 70px; margin-right: 10px; padding: 2px; float: left; position: relative; overflow: hidden; z-index: 99; } ul.bestselling li .bs-img a img { /*width: 65px;*/ max-width: 100%; height: 100%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .bs-img:focus, .bs-img:hover { outline: none; } .bs-img a:focus img, .bs-img a:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } ul.bestselling li:hover .bestselling-body h4 a {color: #17ba60;} ul.bestselling li .bestselling-body {position: relative; } /*ul.bestselling li .bestselling-body h4{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }*/ ul.bestselling li .bestselling-body h4 a{ font: normal normal 400 14px/22px 'tm-r',sans-serif; color:#020307; } ul.bestselling li .bestselling-body > span { font: normal normal 700 16px/22px 'tm-r',sans-serif; color:#17ba60; } ul.bestselling li .bestselling-body > span + span{ font: normal normal 400 14px/22px 'tm-r',sans-serif; color: rgba(166,172,167); margin: 0 0 0 20px; text-decoration: line-through; } ul.bestselling li .bestselling-body > span + span + span em{line-height:36px; font-style: normal;margin-right:1px;} ul.bestselling li .bestselling-body > span + span + span{ background-color: #17ba60; font-size: 12px; /*line-height: 0px;*/ color: #fff; text-align: center; text-decoration: none; border-radius: 50%; width: 35px; height: 35px; padding: 0px; margin: 0; position: absolute; bottom: 6px; right: 12px; } /*----------*/ .scroll-attach { margin-top: 15px; padding: 0 8px 0 0; height: 190px; overflow: auto; } .widget-rate[title="scroll-1"]{margin-top: 0;} .widget-rate { margin-top: 15px; padding: 0; list-style: none; } .widget-rate li { font: normal normal 400 14px/25px 'tm-r',sans-serif; color: #020307; padding: 2px 0 2px 25px; position: relative; } .widget-rate li .radio-checkbox { position: absolute; width: 16px; height: 20px; left: 0; } .widget-rate li .group-star { font-size: 13px; color: #17ba60; width: 80px; margin-left:5px; display: inline-block; } .widget-rate li span { float: right; color:rgba(166,172,167,1); } /*--------------------*/ .product-right-sidebar { /*margin-top: 25px; padding-bottom: 50px;*/ } /*------------*/ .product-order { border:1px solid rgba(166,172,167,.6); border-radius: 3px; padding: 8px 5px; margin:0 0 20px 0; } .product-order .sort-result > span { font: 700 14px/22px 'tm-b',sans-serif; color: #020307; margin:5px 20px 0 0; padding:5px 10px; float: left; } .sort-type{margin:0 20px 0 0;float:left;} .sort-type > label{ margin:0;} .sort-type .select select{ border-width:1px !important; height:40px !important; padding:2px 15px 2px 5px !important; } .product-order .display-mode { font: 400 14px/22px 'tm-r',sans-serif; color: #020307; margin:3px 0 0 20px; padding:5px 10px; float: right; } .product-order .display-mode > span{padding: 0 5px;} .product-order .display-mode a { color:#020307; margin:0; transition: all 0.3s ease-in-out; } .product-order .display-mode a:first-child{ margin:0 0 0 5px;} .product-order .display-mode a:last-child:before{ color: rgb(111,112,114); content: "/"; display: inline-block; padding: 0 5px; } .product-order .display-mode a.active > i.fa{ color:#17ba60; border: 1px solid rgba(23,186,96,1); } .product-order .display-mode a:hover {color:#17ba60;} .product-order .display-mode a:hover > i.fa { background-color: #17ba60; color:#fff; border: 1px solid rgba(23,186,96,1); } .product-order .display-mode a > i.fa { color: #020307; border: 1px solid rgba(166,172,167,1); border-radius:50%; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; transition: all 0.3s ease-in-out; } .product-order .display-mode a > i.fa:before {font-size: 14px;} /*--------*/ ul.products{ list-style:none; margin:0; padding:0; } .products .product-item { /*min-height:315px;*/ width:31.6%; display: block; float: left; margin: 1% 0 2% 2.6%; position: relative; } /*.products .product-item:first-child,*/ .products .product-item:nth-child(3n+1){margin-left: 0;} .product-inner{ border: 1px solid rgba(166,172,167,.6); border-radius: 3px; display: block; } .product-inner:hover{box-shadow:0 2px 10px 1px rgba(0, 0, 0, 0.08);} .product-list-info{ overflow: hidden; position: relative; } /*--------------------------------------BEKLET*/ .product-list-info .extra-tools{ position: absolute; overflow: hidden; top:130px; left:90px; } .product-list-info .extra-tools { -webkit-transform: translateX(-300px); -moz-transform: translateX(-300px); -o-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .product-list-info:hover .extra-tools { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .info { display: inline-block; text-decoration: none; padding: 7px 14px; background: #062d55; color: #fff; font-size:0.9em; } .info:hover {background:#17ba60;} /*
Hızlı Göster
*/ /*-------------------------------- BEKLET*/ /*---------------*/ .product-list-info{min-height: 320px; padding:12px;} h3.product-name{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } h3.product-name a { font: 400 14px/22px 'tm-r',sans-serif; color: #020307; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } h3.product-name a:hover{color: #17ba60;} h4.product-code{ font: 400 13px/20px 'tm-r',sans-serif; color:rgba(166,172,167,1); } .product-figure{position: relative;min-height: 200px;text-align:center;margin-top: 15px;} .product-list-info .product-figure img { max-width: 100%; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; } .product-list-info .product-figure:hover img{ -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); opacity: 1; } /*---------------------------------*/ .product-figure .product-extra-tools{position:absolute;bottom:0px;left:0px;z-index:1} .product-figure .product-extra-tools ul{margin-bottom:0px} .product-figure .product-extra-tools ul li{ -webkit-transform:translateX(-60px); -moz-transform:translateX(-60px); -ms-transform:translateX(-60px); -o-transform:translateX(-60px); transform:translateX(-60px); opacity:0; filter:alpha(opacity=0); } .product-list-info:hover .product-figure .product-extra-tools ul li{ -webkit-transform:translateX(0); -moz-transform:translateX(0); -ms-transform:translateX(0); -o-transform:translateX(0); transform:translateX(0); opacity:1; filter:alpha(opacity=100); -webkit-transition:transform .4s ease; -moz-transition:transform .4s ease; -ms-transition:transform .4s ease; -o-transition:transform .4s ease; transition:transform .4s ease; } .product-list-info:hover .product-figure .product-extra-tools ul li:nth-child(1){ -webkit-transition:transform .4s ease .1s; -moz-transition:transform .4s ease .1s; -ms-transition:transform .4s ease .1s; c-o-transition:transform .4s ease .1s; transition:transform .4s ease .1s; } .product-list-info:hover .product-figure .product-extra-tools ul li:nth-child(2){ -webkit-transition:transform .4s ease .2s; -moz-transition:transform .4s ease .2s; -ms-transition:transform .4s ease .2s; -o-transition:transform .4s ease .2s; transition:transform .4s ease .2s; } .product-list-info:hover .product-figure .product-extra-tools ul li:nth-child(3){ -webkit-transition:transform .4s ease .3s; -moz-transition:transform .4s ease .3s; -ms-transition:transform .4s ease .3s; -o-transition:transform .4s ease .3s; transition:transform .4s ease .3s; } .product-list-info:hover .product-figure .product-extra-tools ul li:nth-child(4){ -webkit-transition:transform .4s ease .4s; -moz-transition:transform .4s ease .4s; -ms-transition:transform .4s ease .4s; -o-transition:transform .4s ease .4s; transition:transform .4s ease .4s; } .product-extra-tools{margin-top:16px;font-size:0px;display:inline-block} .product-extra-tools ul li{position:relative} .product-extra-tools a{ background:rgba(2,3,7,.7); font-size:14px; line-height:30px; color:#fff; border-radius: 50%; height:30px; width:30px; text-align:center; padding:0; display:inline-block; margin-bottom:5px; position:relative; letter-spacing:0px; text-indent:0px; text-transform:none; } .product-extra-tools ul li a:hover{color:#17ba60} .product-extra-tools ul li a i.fa { font-size: 14px; display: inline-block; height: 30px; line-height: 30px; width: 30px; border-radius: 100%; } .product-price{position: relative;padding: 12px;} .product-price:hover span + span + span{background-color:#062d55;} .product-price > span { font-size: 18px; font-weight: 700; color:#020307; } .product-price > span + span{ font-size: 16px; font-weight:400; color: rgba(166,172,167); margin: 0 0 0 10px; text-decoration: line-through; } .product-price > span + span + span em{line-height:36px; font-style: normal;margin-right:1px;} .product-price > span + span + span{ background-color: #17ba60; font-size: 12px; /*line-height: 0px;*/ color: #fff; text-align: center; text-decoration: none; border-radius: 50%; width: 35px; height: 35px; padding: 0px; margin: 0; position: absolute; top: 6px; right: 12px; } .product-rating{ background: rgba(166,172,167,.6); font: 400 14px/32px 'tm-r',sans-serif; color: #020307; border-bottom-left-radius: 3px; width: 50%; padding: 5px; float: left; display: block; } .product-rating ul {margin:0;} .product-rating ul li { position: relative; display: inline-block; } .product-rating ul li:not(:nth-child(2)){ margin: 0 10px 0 0;} .product-rating ul li.rating-stars + span { color:#17ba60; font-size:12px;} .product-rating ul li span { color: #17ba60; font-weight: bold; } .product-rating ul li i {color: #17ba60;margin: 0 1px;} .product-inner a.product-details { background: #17ba60 none repeat scroll 0 0; font: 600 16px/32px "tm-sb",sans-serif; color: #fff; text-align: center; text-decoration: none; text-shadow: 0 1px rgba(0, 0, 0, 0.15); border-bottom-right-radius: 3px; width:50%; padding:5px 10px; display: inline-block; position:relative; opacity:1; } .product-inner a.product-details span{font: 400 16px/26px "tm-r",sans-serif;} .product-inner a.product-details:hover { background-color: #062d55; color: #fff; } /*--------------*/ .range-container { width: 100%; min-height: 50px; padding: 15px 0; position: relative; } .range-container span#show-fvalue{right: 25px;} .range-container span{ font-size: 18px; color: #17ba60; position: absolute; bottom: -5px; } .range-container span+span{ font-size: 18px; color: #17ba60; font-weight: bold; margin: 0 5px; position: absolute; right: 2px; bottom: -5px; } .range-container span+span i.fa-star{ color: #17ba60; bottom: 2px; } .range-slider { -webkit-appearance: none; width: 100%; height: 12px; border-radius: 6px; background: #d3d3d3; outline: none; opacity: 0.7; -webkit-transition: .2s; transition: opacity .2s; } .range-slider:hover { opacity: 1; } .range-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 23px; height: 23px; border:none; border-radius: 50%; background: #17ba60; cursor: pointer; } .range-slider::-moz-range-thumb { width: 23px; height: 23px; border:none; border-radius: 50%; background: #17ba60; cursor: pointer; } /*------------ DETAILS*/ .product-details-info{ } h3.details-title { font: normal normal 700 22px/24px 'tm-b',sans-serif; color: #020307; display:block; } h3.details-title:hover {color: #17ba60;} .details-title, .details-comment-rating{ margin-bottom: 15px; } /*-----------------------*/ .details-comment-rating ul{ list-style: none; margin: 0; padding: 7px 0; } .details-comment-rating ul li{ position: relative; display: inline-block; } /*---------*/ .voting-area{ background: none repeat scroll 0 0; color: #020307; } .voting-area > label { font-style: normal; color: #020307; float: right; } .voting-area > label:before { margin:0 3px; font-size: 16px; font-family: FontAwesome; display: inline-block; content: "\f005"; } .voting-area > input{display: none;} /*.voting-area > input:checked ~ label, */ .voting-area:not(:checked) > label:hover, .voting-area:not(:checked) > label:hover ~ label {color: #17ba60; cursor:pointer;} .voting-area > input:checked + label:hover, .voting-area > input:checked ~ label:hover, .voting-area > label:hover ~ input:checked ~ label, .voting-area > input:checked ~ label:hover ~ label {color: #17ba60;} .voting-area-result > i.give-color {color: #17ba60 !important;} .voting-area-result > i { font-style: normal; color: #17ba60; /*float: right; */ } .voting-area-result > i:before { margin:0 3px; font-size: 16px; /*font-family: FontAwesome; display: inline-block; content: "\f005";*/ } /*--------*/ .details-comment-rating ul li i {/*color: #17ba60; font-size:16px;*/} .details-comment-rating ul li:not(:nth-last-child(2)){margin: 0 20px 0 0;} .details-comment-rating ul li:first-child + span { color:rgba(167,172,166,.6); font-size:12px;} .details-comment-rating ul li span { color: #17ba60; font-weight: bold; } .details-comment-rating ul li:nth-last-child(1), .details-comment-rating ul li:nth-last-child(2){ float:right;} .details-comment-rating ul li:nth-last-child(1) a, .details-comment-rating ul li:nth-last-child(2) a{ color:#020307; transition:all 0.3s ease-in-out 0s; } .details-comment-rating ul li:nth-last-child(1) a:hover, .details-comment-rating ul li:nth-last-child(2) a:hover{ color: #17ba60;} .details-comment-rating ul li:nth-last-child(1):before { background-color: rgba(167,172,166,.6); content: " "; width: 1px; height: 14px; position: absolute; top: 5px; right: -12px; } /*-----------*/ .details-price{position: relative;padding:15px 0;} .details-price:hover span + span + span{background-color:#062d55;} .details-price > span { font-size: 30px; font-weight: 700; color:#17ba60; } .details-price > span + span{ font-size: 24px; font-weight:400; color: rgba(166,172,167); margin: 0 0 0 20px; text-decoration: line-through; } .details-price > span + span + span em{line-height:40px; font-style: normal;margin-right:1px;} .details-price > span + span + span{ background-color: #17ba60; font-size: 14px; color: #fff; text-align: center; text-decoration: none; border-radius: 50%; width: 40px; height: 40px; padding: 0px; margin: 0; position: absolute; top: 6px; right: 12px; } /*--------------------*/ .details-extra-tools ul{ list-style:none; margin: 0; padding: 0; } .details-extra-tools ul li { position: relative; display: inline-block; margin: 0 7px 0 0; } .details-extra-tools ul li a{ font:normal normal 400 14px/22px "tm-r",sans-serif; color:#020307; transition:all 0.3s ease-in-out 0s; } .details-extra-tools ul li a:hover{ color: #17ba60;} .details-extra-tools ul li i { color: #17ba60; font-size:16px; margin:0 5px 0 0; } .details-price, .details-extra-tools, .details-list, .details-basket, .details-statement, .details-social-media{ border-bottom: 1px solid rgba(167,172,166,.6); padding: 20px 0; margin: 0px; } /*------*/ .db-cell {float:left;padding-right: 15px;} .db-cell:nth-child(2){min-width: 190px;} .details-basket ul { margin: 0px; padding: 0; display:block; } .details-basket ul li { color: #020307; width: 46px; height: 46px; float: left; } .details-basket ul li:nth-child(2){ width: 85px; border-top: 1px solid rgba(166,172,167,.6); border-bottom: 1px solid rgba(166,172,167,.6); } .details-basket ul li * { width: 100%; height: 100%; /*border: 1px solid rgba(166,172,167,.6);*/ border-radius: 0; outline: none; text-align: center; } .details-basket ul li .button-plus { background-color: rgba(166,172,167,.6); font:normal normal 700 22px/24px 'tm-b',sans-serif; color: #020307; padding: 0; } .details-basket ul li .button-plus.minus{ border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .details-basket ul li .button-plus.plus{ border-top-right-radius: 3px; border-bottom-right-radius: 3px; } /*--------------*/ .details-list ul { list-style:none; margin: 0; padding: 0; } .details-list ul li { display: block; padding: 0px; color: #020307; } .details-list ul li div { font:normal normal 700 14px/22px 'tm-b',sans-serif; width: 20%; display:inline-block; } .details-list ul li div + div { font:normal normal 400 14px/22px "tm-r",sans-serif; width: 78%; } .details-list ul li div + div:before{ content:" : "; width:5px; } /*------------------*/ .details-social-media{margin-bottom: 30px;} ul.more-share-social{ list-style:none; margin: 0; padding: 0; } ul.more-share-social li { display: inline-block; margin:0 3px; } ul.more-share-social li:first-child{ margin:0 15px 0 10px;color: #020307;} ul.more-share-social .fa { background:rgba(166,172,167,.4); color: #020307; font-size: 16px; line-height: 28px; text-align: center; border-radius: 4px; width: 36px; padding:0; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } ul.more-share-social .fa:hover { color: #ffffff; } ul.more-share-social li a [class*="facebook"]:hover { background-color: #3B5998; } ul.more-share-social li a [class*="twitter"]:hover { background-color: #3B8ACA; } ul.more-share-social li a [class*="instagram"]:hover { background-color: #125688; } ul.more-share-social li a [class*="google"]:hover { background-color: #d7473d; } ul.more-share-social li a [class*="linkedin"]:hover { background-color: #0077B5; } ul.more-share-social li a [class*="youtube"]:hover { background-color: #cc181e; } /*--------------*/ .similar-product { margin-top: 5px; margin-bottom: 75px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); } .similar-product:not(.add):hover { position: relative; color: initial; -webkit-transform: translate3d(0,-20px,0); -moz-transform: translate3d(0,-20px,0); -ms-transform: translate3d(0,-20px,0); -o-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0); } .similar-product a {/*display: block;*/} /*.similar-product,*/ ul.similarlist li a { font: 500 14px/22px "tm-r",sans-serif; color: #020307; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; } .similar-product .image { height: 220px; position: relative; } .similar-product .image { background-position: center; background-size: cover; overflow: hidden; height: auto; } .similar-product .image img { display:block; max-width:100%; max-height: 100%; } .similar-product .inner-wrap { background-color: #fff; padding: 10px; position: relative; } /*---------------*/ ul.similarlist.add{ list-style: none; padding: 0; margin: 5px 0 15px; } ul.similarlist{ list-style: none; padding: 0; margin: 0px; } ul.similarlist.add li{ width: 100%; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid rgba(166,172,167,0.6); } ul.similarlist li{ width: 100%; margin:0px; padding: 0px; border-bottom: none; } ul.similarlist li a {margin-bottom: 5px;} ul.similarlist li:hover {border-bottom-color: #17ba60;} ul.similarlist li:hover a{ color:#17ba60; } ul.similarlist li:hover a + div{ color:#020307; } ul.similarlist li a + div { /*font: 500 12px/18px "tm-r",sans-serif;*/ position: relative; padding:8px 0; } ul.similarlist li a + div:hover span + span + span{background-color:#062d55;} ul.similarlist li a + div > span { font-size: 16px; font-weight: 700; color:#17ba60; } ul.similarlist li a + div > span + span{ font-size: 14px; font-weight:400; color: rgba(166,172,167); margin: 0 0 0 10px; text-decoration: line-through; } ul.similarlist li a + div > span + span + span em{line-height:35px; font-style: normal;margin-right:1px;} ul.similarlist li a + div > span + span + span{ background-color: #17ba60; font-size: 12px; color: #fff; text-align: center; text-decoration: none; border-radius: 50%; width: 35px; height: 35px; padding: 0px; margin: 0; position: absolute; top: 2px; right: 3px; } /*-------*/ .similar-tags { background: #fff; display: inline-block; width: 100%; border-top: 1px solid rgba(166,172,167,0.6); padding: 10px; margin: 0; } .similar-tags ul{ list-style: none; margin: 0; padding: 0; } .similar-tags ul li{ font: normal normal 500 14px/22px 'tm-r',sans-serif; color: #020307; } .similar-tags ul li:first-child{float: left;} .similar-tags ul li:not(:first-child){float: right; margin-left:10px;} .similar-tags ul li i{ font-size: 14px; color: #020307; margin: 0px; } .similar-tags ul li i:last-child {margin: 0 10px 0 0;} .similar-tags ul li:hover, .similar-tags ul li:hover i{color: #17ba60;} @media(min-width:768px){ .similar-product { -webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); transform:translate3d(0,0,0); -webkit-transition:all .2s; -moz-transition:all .2s; -o-transition:all .2s; transition:all .2s; } .similar-product:not(.add):hover { position:relative; color:initial; -webkit-transform:translate3d(0,-20px,0); -moz-transform:translate3d(0,-20px,0); -ms-transform:translate3d(0,-20px,0); -o-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0) } .similar-product .image {height:220px;} } /* ----------------------------------------------- J. PRODUCT CATEGORY ------------------------------------------- */ /* =============================================== 05. CONTAINER ================================================= */ /* =============================================== 06. FOOTER ==================================================== */ /* ----------------------------------------------- A. FOOT BOX CONTACT ------------------------------------------- */ footer.foot{ background-color: #062d55; padding: 30px 0; /*margin-top: 80px;*/ } .contact-wrap-top { background: #fff; width: 100%; margin: 0 auto; padding: 0; margin-top: -80px; margin-bottom: 60px; border-radius: 3px; box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1); } .contact-wrap-top .box{ color: #020307; width: 33.333%; float: left; border-right: 1px solid rgba(166,172,167,.6); padding: 30px 15px; } .contact-wrap-top .box i{ float: left; font-size: 36px; color: #17ba60; line-height: 40px; margin-right: 15px; } .contact-wrap-top .box h3 div > span{ font: 700 14px/18px 'tm-b',sans-serif; display:inline-flex; min-width: 165px; } .contact-wrap-top .box h3 div > span:last-child{font-family: "tm-r",sans-serif; font-weight: normal;min-width: auto;} .contact-wrap-top .box:nth-child(3), .contact-wrap-top .box:nth-child(4) { border:none;} .contact-wrap-bottom { width: 100%; display: flex; margin-bottom: 30px; } /*--------*/ .text-oval { background: #17ba60; font:normal normal 700 26px/48px 'tm-b',sans-serif; text-align: center; color: #ffffff; width: 45px; height: 45px; float: left; border-radius: 50%; margin-right: 10px; } .text-oval.text-oval-border { background: transparent; border:2px solid #17ba60; color: #17ba60; } .text-oval.gray { background:rgba(166,172,167,0.6); color: #17ba60; } .text-oval.large { width: 70px; height: 70px; line-height: 70px; font-size: 30px; } .text-oval.square { border-radius: 3px; } /* ----------------------------------------------- A. FOOT BOX CONTACT ------------------------------------------- */ /* ----------------------------------------------- B. SOCIAL MEDIA ----------------------------------------------- */ .social-media{text-align: center;} .social-media ul{ list-style: none; padding: 0; margin:2px 0; } .social-media ul li{ display: inline-block; padding: 0 5px; } .social-media ul li a{ } .social-media ul li a i{ line-height: 36px !important; margin: 0 !important; font-size: 20px !important; color: #020307; background: #fff; width: 34px; height: 34px; display: inline-block; border-radius: 100%; text-align: center; transition: all .3s ease-in-out; } .social-media ul li a i:hover{ color: rgba(255,255,255,1.00); } .social-media ul li a i[class*="facebook"]:hover { background-color: #3B5998; } .social-media ul li a i[class*="twitter"]:hover { background-color: #3B8ACA; } .social-media ul li a i[class*="instagram"]:hover { background-color: #125688; } .social-media ul li a i[class*="google"]:hover { background-color: #d7473d; } .social-media ul li a i[class*="linkedin"]:hover { background-color: #0077B5; } .social-media ul li a i[class*="youtube"]:hover { background-color: #cc181e; } /* ----------------------------------------------- B. SOCIAL MEDIA ----------------------------------------------- */ /* ----------------------------------------------- C. WORKING HOURS ---------------------------------------------- */ .working-hours span{ font: normal normal 400 14px/22px 'tm-r',sans-serif; color: #888; display: block; } /* ----------------------------------------------- C. WORKING HOURS ---------------------------------------------- */ /* ----------------------------------------------- D. FOOTER TITLE ----------------------------------------------- */ h3.foot-title{ font:normal normal 600 20px/26px 'tm-b',sans-serif; color:#17ba60; margin-bottom: 20px; } h3.foot-title span{ font: 20px/26px 'tm-r',sans-serif; } /* ----------------------------------------------- D. FOOTER TITLE ----------------------------------------------- */ /* ----------------------------------------------- E. SITE CONTACT ----------------------------------------------- */ ul.site-contact{ list-style: none; } ul.site-contact li{ color:rgba(255,255,255,.7); margin: 0 0 7px 0; padding: 0 5px; transform: translateZ(0); transition: transform .2s ease-out; } ul.site-contact li:hover{ color: rgba(23,186,96,1); transform: translateX(7px); } ul.site-contact li i { font-size: 16px; width: 20px; margin-right: 7px; float: left; line-height: 24px; } /* ----------------------------------------------- E. SITE CONTACT ----------------------------------------------- */ /* ----------------------------------------------- F. LIST ------------------------------------------------------- */ ul.foot-list { list-style: none; } ul.foot-list li{ width: 50%; float: left; margin: 0 0 7px 0; padding: 0 5px; white-space: nowrap; text-overflow: ellipsis; overflow:hidden; transform: translateZ(0); transition: transform .2s ease-out; } ul.foot-list li:hover{ transform: translateX(7px); } ul.foot-list li a{ color: rgba(255,255,255,.7); } ul.foot-list li a:hover{ color: rgba(23,186,96,1); } /* ----------------------------------------------- F. LIST ------------------------------------------------------- */ /* ----------------------------------------------- G. NEWSLETTER ------------------------------------------------- */ .newsletter-wrap{ position: relative; } .newsletter-wrap > p{ font: normal normal 400 14px/22px 'tm-r', sans-serif; color: rgba(255,255,255,.7); margin-top: 20px; } .newsletter-wrap > form{ margin-bottom: 10px; display: block; position: relative; z-index:1; } .newsletter-wrap > form input{ font: normal normal 400 14px/26px 'tm-r', sans-serif; width: 100%; color: #272727; background: #fff; padding: 8px 20px; display: block; border: 1px solid #e5e5e5; border-radius: 4px; box-shadow: none; } .newsletter-wrap > form input:focus{ color: rgba(23,186,96,1);} .newsletter-wrap > form input:focus + a > i{ color:rgba(23,186,96,1);} .newsletter-wrap > form a{ position: absolute; right: 15px; top: 9px; color: #3f3f3f; } .newsletter-wrap > form a:hover { color: rgba(23,186,96, 1); text-decoration: none; } .newsletter-wrap > form a i{ font-size: 24px; } /* ----------------------------------------------- G. NEWSLETTER ------------------------------------------------- */ /* ----------------------------------------------- H. COPYRIGHT -------------------------------------------------- */ section.copyright{ background-color:#062d55; border-top: 1px solid #0e3863; padding: 9px 0; } section.copyright span{ font:normal normal 400 14px/42px 'tm-r', sans-serif; color: #fff; padding: 5px 0; } section.copyright a{color: #17ba60;} section.copyright a:hover, section.copyright a:hover{ color:rgba(23,186,96, 0.7); text-decoration: none; } /* ----------------------------------------------- H. COPYRIGHT -------------------------------------------------- */ /* ----------------------------------------------- I. SCROLL UP -------------------------------------------------- */ .scroll-up { color: transparent; font-size: 0; text-align: center; text-decoration: none; border-radius: 2px; width: 40px; height:40px; padding: 0; margin-right: 0 !important; line-height: 0; position: fixed; right: 25px !important; bottom: 100px; box-shadow: 0 0 0 3px #17ba60; opacity: 1 !important; z-index: 999; -webkit-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; -ms-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; } .scroll-up::before { background: #17ba60 none repeat scroll 0 0; box-sizing: content-box; content: ""; border-radius: 2px; width: 100%; height: 100%; padding: 2px; position: absolute; top: -2px; left: -2px; pointer-events: none; transition: transform 0.2s ease 0s, opacity 0.3s ease 0s; opacity: 1; z-index: -1; } .scroll-up::after { font: 18px/38px FontAwesome; color: #fff; content: "\f062"; -webkit-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; -ms-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; } .scroll-up:hover { box-shadow: 0 0 0 3px #17ba60; } .scroll-up:hover::before { opacity: 0; transform: scale(1.3); } .scroll-up:hover::after { color: #17ba60; } /* ----------------------------------------------- I. SCROLL UP -------------------------------------------------- */ /* =============================================== 06. FOOTER ==================================================== */ /* =============================================== 07. RESPONSIVE ================================================ */ /* ----------------------------------------------- A. 100X420 ---------------------------------------------------- */ @media all and (min-width:100px) and (max-width:420px){ .top-bar [att="q2"]{display: none;} .menu-logo a{font-size: 30px;line-height: 36px;} .top-search{width: 100%;} /*--------------------------*/ .headline-point .flex-caption h2, .headline-icons .flex-caption h2, .headline-thumb .flex-caption h2, .single-point .flex-caption h2{ font: 700 16px/22px "tm-b",sans-serif; padding-bottom: 5px; } .headline-point .flex-caption h3, .headline-thumb .flex-caption h3{ font: 700 16px/22px "tm-b",sans-serif; padding-bottom: 5px; } .multiple4x-point .flex-caption p, .headline-point .flex-caption p, .headline-icons .flex-caption p, .headline-thumb .flex-caption p, .single-point .flex-caption p { font: 400 13px/16px "tm-r",sans-serif; margin-bottom: 5px; } .multiple4x-point .flex-caption p + p a.more, .headline-point .flex-caption p + p a.more, .headline-icons .flex-caption p + p a.more, .headline-thumb .flex-caption p + p a.more, .single-point .flex-caption p + p a.more { font: 700 11px/20px "tm-b",sans-serif; height: 25px; padding: 0px 15px; margin-top: 5px; } .headline-point .flex-control-nav /*.multiple4x-point .flex-control-nav, .single-point .flex-control-nav, .multiple3x-point .flex-control-nav*/{ bottom: 0; } .count-caption{font-size: 22px;line-height: 28px; padding:0px 0 40px 40px;} .count-caption::before{top: 13px;} .tm-counter:nth-child(even)::before{background-color: transparent;} /*even = çift odd= tek*/ .recovery-info{padding: 20px 0;} /*---------------------------*/ .important-wrapper .image-wrap{ max-width: none; max-height: none; margin: 30px 0 0 0; position: relative; top: 0; right: 0; } /*----------*/ div[att="r1"]{margin-bottom: 30px;} .inside-reference [class*="col-"]:not(:last-child) .reference { border-right: none !important; border-bottom: 1px solid rgba(166,172,167,0.6) !important; } .inside-reference [class*="col-"]:not(:last-child) .reference:hover{ border-right: none !important; border-bottom: 1px solid rgba(23,186,96,1) !important; } /*----------*/ .page-title h3{font-size: 16px;line-height: 24px;} .contact-wrap-top .box{width: 100%;padding: 15px 10px;border-width: 0 0 1px 0;border-style: solid;border-color: rgba(166,172,167,.6);} * + ul.site-contact,ul.foot-list{margin-bottom: 40px;} ul.foot-list li{float: none;width: 100%;} span.pull-right[att="c2"]{display: none;} /*---------------*/ .error-404-wrapper {padding: 35px 0px;} .error-404-wrapper h2[err="1"]{font-size: 112px;line-height: 84px;} .error-404-wrapper h3[err="2"]{font-size: 22px;line-height: 28px;} .error-404-wrapper h5[err="4"]{width: 100%;} .error-404-wrapper h5[err="4"] div[class*="col-"]{margin: 10px 0;} /*--------------*/ #facebox .content{ min-width:auto;} #facebox{ left:4% !important; right:2% !important; margin:10px;} .popup-wrapper .container{width:auto!important;} .tm-form .btn-wrap{ min-width:100% !important;} /*--------------------*/ .about-item .about-info{ border-radius: 0 0 3px 3px; position: static; margin: 0px; padding: 20px 20px 25px; } .about-item:nth-child(2n) .about-info{width: 100%;} .about-item:nth-child(2n) .about-media { border-radius: 3px 3px 0 0; margin-left: 0px; } .about-item .about-media {border-radius: 3px 3px 0 0;} .about-item:nth-child(2n) .direction-2, .about-item .direction-1{ -webkit-order: 2; -ms-flex-order: 2; order: 2; } .media-wrap .media-image{border-radius: 3px 3px 0 0;width: 100%;} .media-wrap .media-info{width: 100%;} /*----------------*/ .sidebar-media-left{padding-right: 0;border-right: none;} .sort-result{width: 100%;} .sort-result.pull-left{float: none;} .product-order .sort-result > span{display: block;margin: 0 0 10px;width: 100%;} .sort-result .sort-type{width: 100%;margin: 0 0 10px;padding: 0 10px;} .product-order .display-mode{margin: 10px 0;} .display-mode.pull-right{float: none;} /*---------------------*/ .products .product-item { width: 100%; float: none; margin: 5% 0 5% 0; } } /* ----------------------------------------------- A. 100x420 ---------------------------------------------------- */ /* ----------------------------------------------- B. 420X768 ---------------------------------------------------- */ @media all and (min-width:420px) and (max-width:768px){ .top-bar [att="q2"]{display: none;} .menu-logo a{font-size: 30px;line-height: 36px;} .top-search{width: 100%;} /*--------------------------*/ .headline-point .flex-caption h2, .headline-icons .flex-caption h2, .headline-thumb .flex-caption h2, .single-point .flex-caption h2{ font: 700 18px/24px "tm-b",sans-serif; padding-bottom: 5px; } .headline-point .flex-caption h3, .headline-thumb .flex-caption h3{ font: 700 18px/24px "tm-b",sans-serif; padding-bottom: 5px; } .multiple4x-point .flex-caption p, .headline-point .flex-caption p, .headline-icons .flex-caption p, .headline-thumb .flex-caption p, .single-point .flex-caption p { font: 400 14px/18px "tm-r",sans-serif; margin-bottom: 5px; } .multiple4x-point .flex-caption p + p a.more, .headline-point .flex-caption p + p a.more, .headline-icons .flex-caption p + p a.more, .headline-thumb .flex-caption p + p a.more, .single-point .flex-caption p + p a.more { font: 700 14px/25px "tm-b",sans-serif; height: 30px; padding: 0px 15px; margin-top: 5px; } .headline-point .flex-control-nav /*.multiple4x-point .flex-control-nav, .single-point .flex-control-nav, .multiple3x-point .flex-control-nav*/{ bottom: 0; } .count-caption{font-size: 22px;line-height: 28px; padding:0px 0 40px 40px;} .count-caption::before{top: 13px;} .tm-counter:nth-child(even)::before{background-color: transparent;} /*even = çift odd= tek*/ .recovery-info{padding: 20px 0;} /*---------------------------*/ .important-wrapper .image-wrap{ max-width: none; max-height: none; margin: 30px 0 0 0; position: relative; top: 0; right: 0; } /*------*/ div[att="r1"]{margin-bottom: 30px;} .inside-reference [class*="col-"]:not(:last-child) .reference { border-right: none !important; border-bottom: 1px solid rgba(166,172,167,0.6) !important; } .inside-reference [class*="col-"]:not(:last-child) .reference:hover{ border-right: none !important; border-bottom: 1px solid rgba(23,186,96,1) !important; } /*----------*/ .page-title h3{font-size: 16px;line-height: 24px;} .contact-wrap-top .box{width: 100%;padding: 15px 10px;border-width: 0 0 1px 0;border-style: solid;border-color: rgba(166,172,167,.6);} * + ul.site-contact,ul.foot-list{margin-bottom: 40px;} ul.foot-list li{float: none;width: 100%;} span.pull-right[att="c2"]{display: none;} /*---------------*/ .error-404-wrapper {padding: 35px 0px;} .error-404-wrapper h2[err="1"]{font-size: 112px;line-height: 84px;} .error-404-wrapper h3[err="2"]{font-size: 22px;line-height: 28px;} .error-404-wrapper h5[err="4"]{width: 100%;} .error-404-wrapper h5[err="4"] div[class*="col-"]{margin: 10px 0;} /*--------------*/ #facebox .content{ min-width:auto;} #facebox{ left:12% !important; right:10% !important; margin:10px;} .popup-wrapper .container{width:auto!important;} .tm-form .btn-wrap{ min-width:100% !important;} /*--------------------*/ .about-item .about-info{ border-radius: 0 0 3px 3px; position: static; margin: 0px; padding: 20px 20px 25px; } .about-item:nth-child(2n) .about-info{width: 100%;} .about-item:nth-child(2n) .about-media { border-radius: 3px 3px 0 0; margin-left: 0px; } .about-item .about-media {border-radius: 3px 3px 0 0;} .about-item:nth-child(2n) .direction-2, .about-item .direction-1{ -webkit-order: 2; -ms-flex-order: 2; order: 2; } /*----------------*/ .sidebar-media-left{padding-right: 0;border-right: none;} .sort-result{width: 100%;} .sort-result.pull-left{float: none;} .product-order .sort-result > span{display: block;margin: 0 0 10px;width: 100%;} .sort-result .sort-type{width: 100%;margin: 0 0 10px;padding: 0 10px;} .product-order .display-mode{margin: 10px 0;} .display-mode.pull-right{float: none;} /*---------------------*/ .products .product-item { width: 100%; float: none; margin: 5% 0 5% 0; } } /* ----------------------------------------------- B. 420X768 ---------------------------------------------------- */ /* ----------------------------------------------- C. 768X992 ---------------------------------------------------- */ @media all and (min-width:768px) and (max-width:992px){ .top-bar [att="q2"]{display: none;} .menu-logo a{font-size: 30px;line-height: 36px;} /*--------------------------*/ .headline-point .flex-caption h2, .headline-icons .flex-caption h2, .headline-thumb .flex-caption h2, .single-point .flex-caption h2{ font: 700 22px/28px "tm-b",sans-serif; padding-bottom: 5px; } .headline-point .flex-caption h3, .headline-thumb .flex-caption h3{ font: 700 22px/28px "tm-b",sans-serif; padding-bottom: 5px; } .multiple4x-point .flex-caption p, .headline-point .flex-caption p, .headline-icons .flex-caption p, .headline-thumb .flex-caption p, .single-point .flex-caption p { font: 400 16px/24px "tm-r",sans-serif; margin-bottom: 5px; } .multiple4x-point .flex-caption p + p a.more, .headline-point .flex-caption p + p a.more, .headline-icons .flex-caption p + p a.more, .headline-thumb .flex-caption p + p a.more, .single-point .flex-caption p + p a.more { font: 700 16px/30px "tm-b",sans-serif; height: 34px; padding: 0px 15px; margin-top: 5px; } .headline-point .flex-control-nav /*.multiple4x-point .flex-control-nav, .single-point .flex-control-nav, .multiple3x-point .flex-control-nav*/{ bottom: 0; } .count-caption{font-size: 22px;line-height: 28px; padding:0px 0 40px 40px;} .count-caption::before{top: 13px;} .tm-counter:nth-child(even)::before{background-color: transparent;} /*even = çift odd= tek*/ .recovery-info{padding: 20px 0;} div[att="r1"]{margin-bottom: 30px;} /*---------------------------*/ .important-wrapper .image-wrap{ max-width: none; max-height: none; margin: 30px 0 0 0; position: relative; top: 0; right: 0; } /*-----------*/ .page-title h3{font-size: 16px;line-height: 24px;} .contact-wrap-top .box{width: 100%;padding: 15px 10px;border-width: 0 0 1px 0;border-style: solid;border-color: rgba(166,172,167,.6);} * + ul.site-contact,ul.foot-list{margin-bottom: 40px;} ul.foot-list li{float: none;width: 100%;} /*--------------*/ #facebox .content{ min-width:auto;} #facebox{ left:14% !important; right:12% !important; margin:20px;} .popup-wrapper .container{width:auto!important;} .tm-form .btn-wrap{ min-width:50% !important;} /*--------------------*/ .about-item .about-info{ border-radius: 0 0 3px 3px; position: static; margin: 0px; padding: 20px 20px 25px; } .about-item:nth-child(2n) .about-info{width: 100%;} .about-item:nth-child(2n) .about-media { border-radius: 3px 3px 0 0; margin-left: 0px; } .about-item .about-media {border-radius: 3px 3px 0 0;} .about-item:nth-child(2n) .direction-2, .about-item .direction-1{ -webkit-order: 2; -ms-flex-order: 2; order: 2; } /*----------------*/ .sidebar-media-left{padding-right: 0;border-right: none;} .sort-result{width: 100%;} .sort-result.pull-left{float: none;} .product-order .sort-result > span{display: block;margin: 0 0 10px;width: 100%;} .sort-result .sort-type{width: 100%;margin: 0 0 10px;padding: 0 10px;} .product-order .display-mode{margin: 10px 0;} .display-mode.pull-right{float: none;} /*---------------------*/ .products .product-item { width: 48.7%; margin: 2% 0 2% 2.6%; } .products .product-item:not(:nth-child(even)) {margin-left: 0;} .products .product-item:nth-child(3n+1){margin-left:2.6% !important;} } /* ----------------------------------------------- C. 768X992 ---------------------------------------------------- */ /* ----------------------------------------------- D. 992X1199 --------------------------------------------------- */ @media all and (min-width:992px) and (max-width:1199px){ /*--------------------------*/ .headline-point .flex-caption h2, .headline-icons .flex-caption h2, .headline-thumb .flex-caption h2, .single-point .flex-caption h2{ font: 700 28px/34px "tm-b",sans-serif; padding-bottom: 5px; } .headline-point .flex-caption h3, .headline-thumb .flex-caption h3{ font: 700 28px/34px "tm-b",sans-serif; padding-bottom: 5px; } .multiple4x-point .flex-caption p, .headline-point .flex-caption p, .headline-icons .flex-caption p, .headline-thumb .flex-caption p, .single-point .flex-caption p { font: 400 20px/28px "tm-r",sans-serif; margin-bottom: 5px; } .multiple4x-point .flex-caption p + p a.more, .headline-point .flex-caption p + p a.more, .headline-icons .flex-caption p + p a.more, .headline-thumb .flex-caption p + p a.more, .single-point .flex-caption p + p a.more { font: 700 16px/30px "tm-b",sans-serif; height: 34px; padding: 0px 15px; margin-top: 5px; } .headline-point .flex-control-nav /*.multiple4x-point .flex-control-nav, .single-point .flex-control-nav, .multiple3x-point .flex-control-nav*/{ bottom: 0; } /*---------------------*/ .products .product-item { width: 48.7%; margin: 2% 0 2% 2.6%; } .products .product-item:nth-child(odd){margin-left: 0;} .products .product-item:nth-child(3n+1){margin-left:2.6% !important;} } /* ----------------------------------------------- D. 992X1199 --------------------------------------------------- */ /* ----------------------------------------------- E. PRINT ------------------------------------------------------ */ @media print{ } /* ----------------------------------------------- E. PRINT ------------------------------------------------------ */ /* =============================================== 07. RESPONSIVE ================================================ */ /* =============================================== 08. ANIMATION ================================================= */ .scroll-downs { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width :34px; height: 55px; } .mousey { width: 3px; padding: 10px 15px; height: 35px; border: 2px solid rgba(166,172,167,1); border-radius: 25px; opacity: 0.75; box-sizing: content-box; } .scroller { width: 3px; height: 10px; border-radius: 25%; background-color: rgba(2,3,7,.7); animation-name: scroll; animation-duration: 2.2s; animation-timing-function: cubic-bezier(.15,.41,.69,.94); animation-iteration-count: infinite; } /* ----------------------------------------------- A. SCROLL ----------------------------------------------------- */ @keyframes scroll { 0% { opacity: 0; } 10% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(15px); opacity: 0;} } /* ----------------------------------------------- A. SCROLL ----------------------------------------------------- */ /* =============================================== 08. ANIMATION ================================================= */