/* * Components CSS - v5 - 2016-07-08 * https://www.myresponsee.com * Copyright 2018, Vision Design - graphic zoo * Free to use under the MIT license. */ /* Tabs */ .tab-item { background: none repeat scroll 0 0 #fff; display: none; padding: 1.25rem 0; } .tab-item.tab-active { display: block; } .tab-content > .tab-label { display: none; } .tab-nav > .tab-label { float:left; } a.tab-label, a.tab-label:link, a.tab-label:visited, a.tab-label:hover { background: none repeat scroll 0 0 #262626; color: #fff; margin-right: 1px; padding: 0.625rem 1.25rem; transition: background 0.20s linear 0s; -o-transition: background 0.20s linear 0s; -ms-transition: background 0.20s linear 0s; -moz-transition: background 0.20s linear 0s; -webkit-transition: background 0.20s linear 0s; } a.tab-label:hover,a.tab-label.active-btn { background: none repeat scroll 0 0 #999; } .tab-label.active-btn { cursor: default; } .tab-content { text-align: left; } @media screen and (max-width:768px) { .tab-nav > .tab-label { margin: 0.5px 0; width: 100%; } } /* Custom forms */ form.customform input, form.customform select, form.customform textarea, form.customform button { font-size:0.9rem; font-family:inherit; margin-bottom:1.25rem; } form.customform input, form.customform select {height: 2.7rem;} form.customform input, form.customform textarea, form.customform select { background: none repeat scroll 0 0 #F5F5F5; transition: background 0.20s linear 0s; -o-transition: background 0.20s linear 0s; -ms-transition: background 0.20s linear 0s; -moz-transition: background 0.20s linear 0s; -webkit-transition: background 0.20s linear 0s; } form.customform input:hover, form.customform textarea:hover, form.customform select:hover, form.customform input:focus, form.customform textarea:focus, form.customform select:focus {background: none repeat scroll 0 0 #fff;} form.customform input, form.customform textarea, form.customform select { background: none repeat scroll 0 0 #F5F5F5; border: 1px solid #E0E0E0; padding: 0.625rem; width: 100%; } form.customform input[type="file"] { border: 1px solid #E0E0E0; height: auto; max-height: 2.7rem; min-height: 2.7rem; padding: 0.4rem; width: 100%; } form.customform input[type="radio"], form.customform input[type="checkbox"] { margin-right: 0.625rem; width:auto; padding:0; height:auto; } form.customform option {padding: 0.625rem;} form.customform select[multiple="multiple"] {height: auto;} form.customform button { width: 100%; background: none repeat scroll 0 0 #152732; border: 0 none; color: #fff; height: 2.7rem; padding: 0.625rem; cursor:pointer; width: 100%; transition: background 0.20s linear 0s; -o-transition: background 0.20s linear 0s; -ms-transition: background 0.20s linear 0s; -moz-transition: background 0.20s linear 0s; -webkit-transition: background 0.20s linear 0s; } /* Tooltip */ a.tooltip-container,.tooltip-container { border-bottom:1px dotted; border-bottom-color: color; cursor: help; font-weight: 600; } a .tooltip-content,.tooltip-content { background: #152732 none repeat scroll 0 0; color: #fff!important; border-radius: 3px; display: none; font-size: 0.8rem; font-weight: normal; line-height: 1.3rem; margin-top: -1.25rem; max-width: 300px; padding: 0.625rem; position: absolute; z-index: 10; } .tooltip-content::after { border-left: 9px solid transparent; border-right: 9px solid transparent; border-top: 7px solid #152732; bottom: -5px; clear: both; content: ""; height: 0; left: 50%; margin-left: -5px; position: absolute; width: 0; } a.tooltip-content.tooltip-bottom,.tooltip-content.tooltip-bottom { margin-top: 1.25rem; } .tooltip-content.tooltip-bottom::after { border-left: 9px solid transparent; border-right: 9px solid transparent; border-top: 0; border-bottom: 7px solid #152732; top: -5px; } /* Buttons */ .button,a.button,a.button:link,a.button:active,a.button:visited { background: #777 none repeat scroll 0 0; border: 0; color: #fff; cursor: pointer; display: inline-block; font-size: 0.85rem; padding: 0.825rem 1rem; text-align: center; transition: all 0.20s linear 0s; -o-transition: all 0.20s linear 0s; -ms-transition: all 0.20s linear 0s; -moz-transition: all 0.20s linear 0s; -webkit-transition: all 0.20s linear 0s; } .button.rounded-btn { border-radius: 4px; } .button.rounded-full-btn { border-radius: 100px; } .button:hover {box-shadow: 0 0 10px 100px rgba(255,255,255,0.15) inset;} .button.secondary-btn,a.button.secondary-btn,a.button.secondary-btn:link,a.button.secondary-btn:active,a.button.secondary-btn:visited { background: #444 none repeat scroll 0 0; } .button.cancel-btn,a.button.cancel-btn,a.button.cancel-btn:link,a.button.cancel-btn:active,a.button.cancel-btn:visited { background: #dc003a none repeat scroll 0 0; } .button.submit-btn,a.button.submit-btn,a.button.submit-btn:link,a.button.submit-btn:active,a.button.submit-btn:visited { background: #b4bf04 none repeat scroll 0 0; } .button.reload-btn,a.button.reload-btn,a.button.reload-btn:link,a.button.reload-btn:active,a.button.reload-btn:visited { background: #ff9800 none repeat scroll 0 0; } .button.disabled-btn { cursor: not-allowed!important; opacity: 0.2; } .button i { background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0; border-radius: 27px; color: #fff!important; display: inline-block; font-size: 0.8rem; height: 27px; line-height: 27px; margin-right: 5px; width: 27px; transition: all 0.20s linear 0s; -o-transition: all 0.20s linear 0s; -ms-transition: all 0.20s linear 0s; -moz-transition: all 0.20s linear 0s; -webkit-transition: all 0.20s linear 0s; } .button:hover > i { background: rgba(0, 0, 0, 0.06) none repeat scroll 0 0; }