UNPKG

materialstrap

Version:

Bootstrap meets Google’s Material Design

2,532 lines (1,890 loc) 149 kB
/* File Link for Light Version */ @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap"); @import url("https://fonts.googleapis.com/css?family=Roboto+Mono&display=swap"); /*========== Custome Fonts ==========*/ /*========== End Custome Fonts ==========*/ /*========== Start Basic Typography ==========*/ html { background-color: #fff; } body { color: rgba(0, 0, 0, 0.6); font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; line-height: 1.6em; background-color: rgba(0, 0, 0, 0.02); overflow-x: hidden; -webkit-font-smoothing: antialiased; } h1, h2, h3, h4, h3, h5, h6, .h1, .h2, .h3, .h4, .h3, .h5, .h6 { clear: both; color: rgba(0, 0, 0, 0.87); padding: 0; margin: 0 0 10px 0; line-height: 1.2em; } h1, .h1 { font-size: 86px; letter-spacing: -1.5px; font-weight: 300; } h2, .h2 { font-size: 60px; letter-spacing: -0.5px; font-weight: 300; } h3, .h3 { font-size: 48px; font-weight: 400; letter-spacing: 0; } h4, .h4 { font-size: 34px; font-weight: 400; letter-spacing: 0.25px; } h5, .h5 { font-size: 24px; font-weight: 400; letter-spacing: 0; } h6, .h6 { font-size: 20px; font-weight: 400; letter-spacing: 0.25px; } p { margin-bottom: 12px; } ul { margin: 0 0 15px 0; padding-left: 15px; list-style: square outside none; } ol { padding-left: 15px; margin-bottom: 15px; } li { font-size: 14px; } dfn, cite, em, i { font-style: italic; } blockquote { margin: 0; } address { margin: 0 0 15px; } img { border: 0; max-width: 100%; height: auto; } a { color: inherit; background-color: transparent; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } a:hover, a:active { outline: none; color: rgba(0, 0, 0, 0.87); text-decoration: none; } hr { border-color: #eaeaea; margin: 0; } /*========== End Basic Typography ==========*/ /*========== Start Default Spacing ==========*/ @media screen and (min-width: 992px) { .yoo-height-b0 { height: 0px; } .yoo-height-b5 { height: 5px; } .yoo-height-b10 { height: 10px; } .yoo-height-b15 { height: 15px; } .yoo-height-b20 { height: 20px; } .yoo-height-b25 { height: 25px; } .yoo-height-b30 { height: 30px; } .yoo-height-b35 { height: 35px; } .yoo-height-b40 { height: 40px; } .yoo-height-b45 { height: 45px; } .yoo-height-b50 { height: 50px; } .yoo-height-b55 { height: 55px; } .yoo-height-b60 { height: 60px; } .yoo-height-b65 { height: 65px; } .yoo-height-b70 { height: 70px; } .yoo-height-b75 { height: 75px; } .yoo-height-b80 { height: 80px; } .yoo-height-b85 { height: 85px; } .yoo-height-b90 { height: 90px; } .yoo-height-b95 { height: 95px; } .yoo-height-b100 { height: 100px; } .yoo-height-b105 { height: 105px; } .yoo-height-b110 { height: 110px; } .yoo-height-b115 { height: 115px; } .yoo-height-b120 { height: 120px; } .yoo-height-b125 { height: 125px; } .yoo-height-b130 { height: 130px; } .yoo-height-b135 { height: 135px; } .yoo-height-b140 { height: 140px; } .yoo-height-b145 { height: 145px; } .yoo-height-b150 { height: 150px; } .yoo-height-b155 { height: 155px; } .yoo-height-b160 { height: 160px; } .yoo-height-b165 { height: 165px; } .yoo-height-b170 { height: 170px; } .yoo-height-b175 { height: 175px; } .yoo-height-b180 { height: 180px; } .yoo-height-b185 { height: 185px; } .yoo-height-b190 { height: 190px; } .yoo-height-b195 { height: 195px; } .yoo-height-b200 { height: 200px; } .yoo-height-b205 { height: 205px; } .yoo-height-b210 { height: 210px; } } @media screen and (max-width: 991px) { .yoo-height-lg-b0 { height: 0px; } .yoo-height-lg-b5 { height: 5px; } .yoo-height-lg-b10 { height: 10px; } .yoo-height-lg-b15 { height: 15px; } .yoo-height-lg-b20 { height: 20px; } .yoo-height-lg-b25 { height: 25px; } .yoo-height-lg-b30 { height: 30px; } .yoo-height-lg-b35 { height: 35px; } .yoo-height-lg-b40 { height: 40px; } .yoo-height-lg-b45 { height: 45px; } .yoo-height-lg-b50 { height: 50px; } .yoo-height-lg-b55 { height: 55px; } .yoo-height-lg-b60 { height: 60px; } .yoo-height-lg-b65 { height: 65px; } .yoo-height-lg-b70 { height: 70px; } .yoo-height-lg-b75 { height: 75px; } .yoo-height-lg-b80 { height: 80px; } .yoo-height-lg-b85 { height: 85px; } .yoo-height-lg-b90 { height: 90px; } .yoo-height-lg-b95 { height: 95px; } .yoo-height-lg-b100 { height: 100px; } .yoo-height-lg-b105 { height: 105px; } .yoo-height-lg-b110 { height: 110px; } .yoo-height-lg-b115 { height: 115px; } .yoo-height-lg-b120 { height: 120px; } .yoo-height-lg-b125 { height: 125px; } .yoo-height-lg-b130 { height: 130px; } .yoo-height-lg-b135 { height: 135px; } .yoo-height-lg-b140 { height: 140px; } .yoo-height-lg-b145 { height: 145px; } .yoo-height-lg-b150 { height: 150px; } .yoo-height-lg-b155 { height: 155px; } .yoo-height-lg-b160 { height: 160px; } .yoo-height-lg-b165 { height: 165px; } .yoo-height-lg-b170 { height: 170px; } .yoo-height-lg-b175 { height: 175px; } .yoo-height-lg-b180 { height: 180px; } .yoo-height-lg-b185 { height: 185px; } .yoo-height-lg-b190 { height: 190px; } .yoo-height-lg-b195 { height: 195px; } .yoo-height-lg-b200 { height: 200px; } .yoo-height-lg-b205 { height: 205px; } .yoo-height-lg-b210 { height: 210px; } } /*========== End Default Spacing ==========*/ /*========== Start Margin Classes ==========*/ .yoo-margin-0 { margin: 0; } .yoo-margin-1 { margin: 1px; } .yoo-margin-2 { margin: 2px; } .yoo-margin-3 { margin: 3px; } .yoo-margin-4 { margin: 4px; } .yoo-margin-5 { margin: 5px; } .yoo-margin-6 { margin: 6px; } .yoo-margin-7 { margin: 7px; } .yoo-margin-8 { margin: 8px; } .yoo-margin-9 { margin: 9px; } .yoo-margin-10 { margin: 10px; } .yoo-margin-11 { margin: 11px; } .yoo-margin-12 { margin: 12px; } .yoo-margin-13 { margin: 13px; } .yoo-margin-14 { margin: 14px; } .yoo-margin-15 { margin: 15px; } .yoo-margin-top-0 { margin-top: 0; } .yoo-margin-top-1 { margin-top: 1px; } .yoo-margin-top-2 { margin-top: 2px; } .yoo-margin-top-3 { margin-top: 3px; } .yoo-margin-top-4 { margin-top: 4px; } .yoo-margin-top-5 { margin-top: 5px; } .yoo-margin-top-6 { margin-top: 6px; } .yoo-margin-top-7 { margin-top: 7px; } .yoo-margin-top-8 { margin-top: 8px; } .yoo-margin-top-9 { margin-top: 9px; } .yoo-margin-top-10 { margin-top: 10px; } .yoo-margin-top-11 { margin-top: 11px; } .yoo-margin-top-12 { margin-top: 12px; } .yoo-margin-top-13 { margin-top: 13px; } .yoo-margin-top-14 { margin-top: 14px; } .yoo-margin-top-15 { margin-top: 15px; } .yoo-margin-bottom-0 { margin-bottom: 0; } .yoo-margin-bottom-1 { margin-bottom: 1px; } .yoo-margin-bottom-2 { margin-bottom: 2px; } .yoo-margin-bottom-3 { margin-bottom: 3px; } .yoo-margin-bottom-4 { margin-bottom: 4px; } .yoo-margin-bottom-5 { margin-bottom: 5px; } .yoo-margin-bottom-6 { margin-bottom: 6px; } .yoo-margin-bottom-7 { margin-bottom: 7px; } .yoo-margin-bottom-8 { margin-bottom: 8px; } .yoo-margin-bottom-9 { margin-bottom: 9px; } .yoo-margin-bottom-10 { margin-bottom: 10px; } .yoo-margin-bottom-11 { margin-bottom: 11px; } .yoo-margin-bottom-12 { margin-bottom: 12px; } .yoo-margin-bottom-13 { margin-bottom: 13px; } .yoo-margin-bottom-14 { margin-bottom: 14px; } .yoo-margin-bottom-15 { margin-bottom: 15px; } .yoo-margin-left-0 { margin-left: 0; } .yoo-margin-left-1 { margin-left: 1px; } .yoo-margin-left-2 { margin-left: 2px; } .yoo-margin-left-3 { margin-left: 3px; } .yoo-margin-left-4 { margin-left: 4px; } .yoo-margin-left-5 { margin-left: 5px; } .yoo-margin-left-6 { margin-left: 6px; } .yoo-margin-left-7 { margin-left: 7px; } .yoo-margin-left-8 { margin-left: 8px; } .yoo-margin-left-9 { margin-left: 9px; } .yoo-margin-left-10 { margin-left: 10px; } .yoo-margin-left-11 { margin-left: 11px; } .yoo-margin-left-12 { margin-left: 12px; } .yoo-margin-left-13 { margin-left: 13px; } .yoo-margin-left-14 { margin-left: 14px; } .yoo-margin-left-15 { margin-left: 15px; } .yoo-margin-right-0 { margin-right: 0; } .yoo-margin-right-1 { margin-right: 1px; } .yoo-margin-right-2 { margin-right: 2px; } .yoo-margin-right-3 { margin-right: 3px; } .yoo-margin-right-4 { margin-right: 4px; } .yoo-margin-right-5 { margin-right: 5px; } .yoo-margin-right-6 { margin-right: 6px; } .yoo-margin-right-7 { margin-right: 7px; } .yoo-margin-right-8 { margin-right: 8px; } .yoo-margin-right-9 { margin-right: 9px; } .yoo-margin-right-10 { margin-right: 10px; } .yoo-margin-right-11 { margin-right: 11px; } .yoo-margin-right-12 { margin-right: 12px; } .yoo-margin-right-13 { margin-right: 13px; } .yoo-margin-right-14 { margin-right: 14px; } .yoo-margin-right-15 { margin-right: 15px; } /*========== End Margin Classes ==========*/ /*========== Start Padidng Classes ==========*/ .yoo-padding-0 { padding: 0; } .yoo-padding-1 { padding: 1px; } .yoo-padding-2 { padding: 2px; } .yoo-padding-3 { padding: 3px; } .yoo-padding-4 { padding: 4px; } .yoo-padding-5 { padding: 5px; } .yoo-padding-6 { padding: 6px; } .yoo-padding-7 { padding: 7px; } .yoo-padding-8 { padding: 8px; } .yoo-padding-9 { padding: 9px; } .yoo-padding-10 { padding: 10px; } .yoo-padding-11 { padding: 11px; } .yoo-padding-12 { padding: 12px; } .yoo-padding-13 { padding: 13px; } .yoo-padding-14 { padding: 14px; } .yoo-padding-15 { padding: 15px; } .yoo-padding-top-0 { padding-top: 0; } .yoo-padding-top-1 { padding-top: 1px; } .yoo-padding-top-2 { padding-top: 2px; } .yoo-padding-top-3 { padding-top: 3px; } .yoo-padding-top-4 { padding-top: 4px; } .yoo-padding-top-5 { padding-top: 5px; } .yoo-padding-top-6 { padding-top: 6px; } .yoo-padding-top-7 { padding-top: 7px; } .yoo-padding-top-8 { padding-top: 8px; } .yoo-padding-top-9 { padding-top: 9px; } .yoo-padding-top-10 { padding-top: 10px; } .yoo-padding-top-11 { padding-top: 11px; } .yoo-padding-top-12 { padding-top: 12px; } .yoo-padding-top-13 { padding-top: 13px; } .yoo-padding-top-14 { padding-top: 14px; } .yoo-padding-top-15 { padding-top: 15px; } .yoo-padding-bottom-0 { padding-bottom: 0; } .yoo-padding-bottom-1 { padding-bottom: 1px; } .yoo-padding-bottom-2 { padding-bottom: 2px; } .yoo-padding-bottom-3 { padding-bottom: 3px; } .yoo-padding-bottom-4 { padding-bottom: 4px; } .yoo-padding-bottom-5 { padding-bottom: 5px; } .yoo-padding-bottom-6 { padding-bottom: 6px; } .yoo-padding-bottom-7 { padding-bottom: 7px; } .yoo-padding-bottom-8 { padding-bottom: 8px; } .yoo-padding-bottom-9 { padding-bottom: 9px; } .yoo-padding-bottom-10 { padding-bottom: 10px; } .yoo-padding-bottom-11 { padding-bottom: 11px; } .yoo-padding-bottom-12 { padding-bottom: 12px; } .yoo-padding-bottom-13 { padding-bottom: 13px; } .yoo-padding-bottom-14 { padding-bottom: 14px; } .yoo-padding-bottom-15 { padding-bottom: 15px; } .yoo-padding-left-0 { padding-left: 0; } .yoo-padding-left-1 { padding-left: 1px; } .yoo-padding-left-2 { padding-left: 2px; } .yoo-padding-left-3 { padding-left: 3px; } .yoo-padding-left-4 { padding-left: 4px; } .yoo-padding-left-5 { padding-left: 5px; } .yoo-padding-left-6 { padding-left: 6px; } .yoo-padding-left-7 { padding-left: 7px; } .yoo-padding-left-8 { padding-left: 8px; } .yoo-padding-left-9 { padding-left: 9px; } .yoo-padding-left-10 { padding-left: 10px; } .yoo-padding-left-11 { padding-left: 11px; } .yoo-padding-left-12 { padding-left: 12px; } .yoo-padding-left-13 { padding-left: 13px; } .yoo-padding-left-14 { padding-left: 14px; } .yoo-padding-left-15 { padding-left: 15px; } .yoo-padding-right-0 { padding-right: 0; } .yoo-padding-right-1 { padding-right: 1px; } .yoo-padding-right-2 { padding-right: 2px; } .yoo-padding-right-3 { padding-right: 3px; } .yoo-padding-right-4 { padding-right: 4px; } .yoo-padding-right-5 { padding-right: 5px; } .yoo-padding-right-6 { padding-right: 6px; } .yoo-padding-right-7 { padding-right: 7px; } .yoo-padding-right-8 { padding-right: 8px; } .yoo-padding-right-9 { padding-right: 9px; } .yoo-padding-right-10 { padding-right: 10px; } .yoo-padding-right-11 { padding-right: 11px; } .yoo-padding-right-12 { padding-right: 12px; } .yoo-padding-right-13 { padding-right: 13px; } .yoo-padding-right-14 { padding-right: 14px; } .yoo-padding-right-15 { padding-right: 15px; } /*========== End Padidng Classes ==========*/ /*========== Start General Style ==========*/ .container-fluid { padding-left: 30px; padding-right: 30px; } /* Margin Classes */ .yoo-margin-0 { margin: 0; } .yoo-margin-1 { margin: 1px; } .yoo-margin-2 { margin: 2px; } .yoo-margin-3 { margin: 3px; } .yoo-margin-4 { margin: 4px; } .yoo-margin-5 { margin: 5px; } .yoo-margin-6 { margin: 6px; } .yoo-margin-7 { margin: 7px; } .yoo-margin-8 { margin: 8px; } .yoo-margin-9 { margin: 9px; } .yoo-margin-10 { margin: 10px; } .yoo-margin-11 { margin: 11px; } .yoo-margin-12 { margin: 12px; } .yoo-margin-13 { margin: 13px; } .yoo-margin-14 { margin: 14px; } .yoo-margin-15 { margin: 15px; } .yoo-margin-top-0 { margin-top: 0; } .yoo-margin-top-1 { margin-top: 1px; } .yoo-margin-top-2 { margin-top: 2px; } .yoo-margin-top-3 { margin-top: 3px; } .yoo-margin-top-4 { margin-top: 4px; } .yoo-margin-top-5 { margin-top: 5px; } .yoo-margin-top-6 { margin-top: 6px; } .yoo-margin-top-7 { margin-top: 7px; } .yoo-margin-top-8 { margin-top: 8px; } .yoo-margin-top-9 { margin-top: 9px; } .yoo-margin-top-10 { margin-top: 10px; } .yoo-margin-top-11 { margin-top: 11px; } .yoo-margin-top-12 { margin-top: 12px; } .yoo-margin-top-13 { margin-top: 13px; } .yoo-margin-top-14 { margin-top: 14px; } .yoo-margin-top-15 { margin-top: 15px; } .yoo-margin-bottom-0 { margin-bottom: 0; } .yoo-margin-bottom-1 { margin-bottom: 1px; } .yoo-margin-bottom-2 { margin-bottom: 2px; } .yoo-margin-bottom-3 { margin-bottom: 3px; } .yoo-margin-bottom-4 { margin-bottom: 4px; } .yoo-margin-bottom-5 { margin-bottom: 5px; } .yoo-margin-bottom-6 { margin-bottom: 6px; } .yoo-margin-bottom-7 { margin-bottom: 7px; } .yoo-margin-bottom-8 { margin-bottom: 8px; } .yoo-margin-bottom-9 { margin-bottom: 9px; } .yoo-margin-bottom-10 { margin-bottom: 10px; } .yoo-margin-bottom-11 { margin-bottom: 11px; } .yoo-margin-bottom-12 { margin-bottom: 12px; } .yoo-margin-bottom-13 { margin-bottom: 13px; } .yoo-margin-bottom-14 { margin-bottom: 14px; } .yoo-margin-bottom-15 { margin-bottom: 15px; } .yoo-margin-left-0 { margin-left: 0; } .yoo-margin-left-1 { margin-left: 1px; } .yoo-margin-left-2 { margin-left: 2px; } .yoo-margin-left-3 { margin-left: 3px; } .yoo-margin-left-4 { margin-left: 4px; } .yoo-margin-left-5 { margin-left: 5px; } .yoo-margin-left-6 { margin-left: 6px; } .yoo-margin-left-7 { margin-left: 7px; } .yoo-margin-left-8 { margin-left: 8px; } .yoo-margin-left-9 { margin-left: 9px; } .yoo-margin-left-10 { margin-left: 10px; } .yoo-margin-left-11 { margin-left: 11px; } .yoo-margin-left-12 { margin-left: 12px; } .yoo-margin-left-13 { margin-left: 13px; } .yoo-margin-left-14 { margin-left: 14px; } .yoo-margin-left-15 { margin-left: 15px; } .yoo-margin-right-0 { margin-right: 0; } .yoo-margin-right-1 { margin-right: 1px; } .yoo-margin-right-2 { margin-right: 2px; } .yoo-margin-right-3 { margin-right: 3px; } .yoo-margin-right-4 { margin-right: 4px; } .yoo-margin-right-5 { margin-right: 5px; } .yoo-margin-right-6 { margin-right: 6px; } .yoo-margin-right-7 { margin-right: 7px; } .yoo-margin-right-8 { margin-right: 8px; } .yoo-margin-right-9 { margin-right: 9px; } .yoo-margin-right-10 { margin-right: 10px; } .yoo-margin-right-11 { margin-right: 11px; } .yoo-margin-right-12 { margin-right: 12px; } .yoo-margin-right-13 { margin-right: 13px; } .yoo-margin-right-14 { margin-right: 14px; } .yoo-margin-right-15 { margin-right: 15px; } /* End Margin Classes */ /* Padidng Classes */ .yoo-padding-0 { padding: 0; } .yoo-padding-1 { padding: 1px; } .yoo-padding-2 { padding: 2px; } .yoo-padding-3 { padding: 3px; } .yoo-padding-4 { padding: 4px; } .yoo-padding-5 { padding: 5px; } .yoo-padding-6 { padding: 6px; } .yoo-padding-7 { padding: 7px; } .yoo-padding-8 { padding: 8px; } .yoo-padding-9 { padding: 9px; } .yoo-padding-10 { padding: 10px; } .yoo-padding-11 { padding: 11px; } .yoo-padding-12 { padding: 12px; } .yoo-padding-13 { padding: 13px; } .yoo-padding-14 { padding: 14px; } .yoo-padding-15 { padding: 15px; } .yoo-padding-top-0 { padding-top: 0; } .yoo-padding-top-1 { padding-top: 1px; } .yoo-padding-top-2 { padding-top: 2px; } .yoo-padding-top-3 { padding-top: 3px; } .yoo-padding-top-4 { padding-top: 4px; } .yoo-padding-top-5 { padding-top: 5px; } .yoo-padding-top-6 { padding-top: 6px; } .yoo-padding-top-7 { padding-top: 7px; } .yoo-padding-top-8 { padding-top: 8px; } .yoo-padding-top-9 { padding-top: 9px; } .yoo-padding-top-10 { padding-top: 10px; } .yoo-padding-top-11 { padding-top: 11px; } .yoo-padding-top-12 { padding-top: 12px; } .yoo-padding-top-13 { padding-top: 13px; } .yoo-padding-top-14 { padding-top: 14px; } .yoo-padding-top-15 { padding-top: 15px; } .yoo-padding-bottom-0 { padding-bottom: 0; } .yoo-padding-bottom-1 { padding-bottom: 1px; } .yoo-padding-bottom-2 { padding-bottom: 2px; } .yoo-padding-bottom-3 { padding-bottom: 3px; } .yoo-padding-bottom-4 { padding-bottom: 4px; } .yoo-padding-bottom-5 { padding-bottom: 5px; } .yoo-padding-bottom-6 { padding-bottom: 6px; } .yoo-padding-bottom-7 { padding-bottom: 7px; } .yoo-padding-bottom-8 { padding-bottom: 8px; } .yoo-padding-bottom-9 { padding-bottom: 9px; } .yoo-padding-bottom-10 { padding-bottom: 10px; } .yoo-padding-bottom-11 { padding-bottom: 11px; } .yoo-padding-bottom-12 { padding-bottom: 12px; } .yoo-padding-bottom-13 { padding-bottom: 13px; } .yoo-padding-bottom-14 { padding-bottom: 14px; } .yoo-padding-bottom-15 { padding-bottom: 15px; } .yoo-padding-left-0 { padding-left: 0; } .yoo-padding-left-1 { padding-left: 1px; } .yoo-padding-left-2 { padding-left: 2px; } .yoo-padding-left-3 { padding-left: 3px; } .yoo-padding-left-4 { padding-left: 4px; } .yoo-padding-left-5 { padding-left: 5px; } .yoo-padding-left-6 { padding-left: 6px; } .yoo-padding-left-7 { padding-left: 7px; } .yoo-padding-left-8 { padding-left: 8px; } .yoo-padding-left-9 { padding-left: 9px; } .yoo-padding-left-10 { padding-left: 10px; } .yoo-padding-left-11 { padding-left: 11px; } .yoo-padding-left-12 { padding-left: 12px; } .yoo-padding-left-13 { padding-left: 13px; } .yoo-padding-left-14 { padding-left: 14px; } .yoo-padding-left-15 { padding-left: 15px; } .yoo-padding-right-0 { padding-right: 0; } .yoo-padding-right-1 { padding-right: 1px; } .yoo-padding-right-2 { padding-right: 2px; } .yoo-padding-right-3 { padding-right: 3px; } .yoo-padding-right-4 { padding-right: 4px; } .yoo-padding-right-5 { padding-right: 5px; } .yoo-padding-right-6 { padding-right: 6px; } .yoo-padding-right-7 { padding-right: 7px; } .yoo-padding-right-8 { padding-right: 8px; } .yoo-padding-right-9 { padding-right: 9px; } .yoo-padding-right-10 { padding-right: 10px; } .yoo-padding-right-11 { padding-right: 11px; } .yoo-padding-right-12 { padding-right: 12px; } .yoo-padding-right-13 { padding-right: 13px; } .yoo-padding-right-14 { padding-right: 14px; } .yoo-padding-right-15 { padding-right: 15px; } /* End Padidng Classes */ .yoo-text-transform-u { text-transform: uppercase; } .yoo-text-transform-l { text-transform: lowercase; } .yoo-text-transform-c { text-transform: capitalize; } .yoo-font-style-i { font-style: italic; } .yoo-font-light { font-weight: 300; } .yoo-font-regular { font-weight: 400; } .yoo-font-medium { font-weight: 500; } .yoo-font-semi-bold { font-weight: 600; } .yoo-font-bold { font-weight: 700; } .yoo-font-black { font-weight: 900; } .yoo-radious1 { border-radius: 1px; } .yoo-radious2 { border-radius: 2px; } .yoo-radious3 { border-radius: 3px; } .yoo-radious4 { border-radius: 4px; } .yoo-radious5 { border-radius: 5px; } .yoo-radious6 { border-radius: 6px; } .yoo-radious7 { border-radius: 7px; } .yoo-radious8 { border-radius: 8px; } .yoo-radious9 { border-radius: 9px; } .yoo-radious10 { border-radius: 10px; } .yoo-radious20 { border-radius: 20px; } .yoo-radious50 { border-radius: 50%; overflow: hidden; } .yoo-padding-lr30 { padding-left: 30px; padding-right: 30px; } .yoo-mp0 { margin: 0; padding: 0; list-style: none; } .yoo-un-list { padding-left: 0; list-style: disc; list-style-position: inside; margin-bottom: 0; } .yoo-un-list li { font-size: 16px; line-height: 1.6em; margin-top: 10px; } .yoo-un-list ul { padding-left: 23px; list-style: disc; list-style-position: inside; } .yoo-un-list > li:first-child { margin-top: 0; } ol.yoo-un-list { list-style-type: decimal; } .yoo-indigo-box { background-color: rgba(63, 81, 174, 0.1); color: #3f51ae; } .yoo-purple-box { background-color: rgba(103, 58, 182, 0.1); color: #673ab6; } .yoo-blue-box { background-color: rgba(33, 150, 243, 0.1); color: #2196f3; } .yoo-green-box { background-color: rgba(76, 175, 80, 0.1); color: #4caf50; } .yoo-red-box { background-color: rgba(244, 67, 54, 0.1); color: #f44336; } .yoo-orange-box { background-color: rgba(255, 152, 0, 0.1); color: #ff9800; } .yoo-blue-gray-box { background-color: rgba(96, 125, 139, 0.1); color: #607d8b; } .yoo-gray-box { background-color: rgba(158, 158, 158, 0.1); color: #9e9e9e; } .yoo-light-gray-box { background-color: rgba(234, 234, 234, 0.1); color: #eaeaea; } .yoo-indigo-transparent-box { background-color: rgba(63, 81, 174, 0.1); color: #3f51ae; } a.yoo-indigo-transparent-box:hover { background-color: #3f51ae; color: #fff; } .yoo-purple-transparent-box { background-color: rgba(103, 58, 182, 0.1); color: #673ab6; } a.yoo-purple-transparent-box:hover { background-color: #673ab6; color: #fff; } .yoo-blue-transparent-box { background-color: rgba(33, 150, 243, 0.1); color: #2196f3; } a.yoo-blue-transparent-box:hover { background-color: #2196f3; color: #fff; } .yoo-green-transparent-box { background-color: rgba(76, 175, 80, 0.1); color: #4caf50; } a.yoo-green-transparent-box:hover { background-color: #4caf50; color: #fff; } .yoo-red-transparent-box { background-color: rgba(244, 67, 54, 0.1); color: #f44336; } a.yoo-red-transparent-box:hover { background-color: #f44336; color: #fff; } .yoo-orange-transparent-box { background-color: rgba(255, 152, 0, 0.1); color: #ff9800; } a.yoo-orange-transparent-box:hover { background-color: #ff9800; color: #fff; } .yoo-gray-transparent-box { background-color: rgba(255, 152, 0, 0.1); color: #9e9e9e; } a.yoo-gray-transparent-box:hover { background-color: #9e9e9e; color: #fff; } .yoo-blue-gray-transparent-box { background-color: rgba(96, 125, 139, 0.1); color: #607d8b; } a.yoo-blue-gray-transparent-box:hover { background-color: #ff9800; color: #fff; } .yoo-success-color { color: #2196f3; } .yoo-success-color-bg { background-color: #2196f3; color: rgba(255, 255, 255, 0.9); } .yoo-danger-color { color: #4caf50; } .yoo-indigo-bg { background-color: #3f51ae; } .yoo-purple-bg { background-color: #673ab6; } .yoo-blue-bg { background-color: #2196f3; } .yoo-green-bg { background-color: #4caf50; } .yoo-red-bg { background-color: #f44336; } .yoo-orange-bg { background-color: #ff9800; } .yoo-gray-bg { background-color: #9e9e9e; } .yoo-blue-gray-bg { background-color: #607d8b; } .yoo-indigo-color { color: #3f51ae; } .yoo-purple-color { color: #673ab6; } .yoo-blue-color { color: #2196f3; } .yoo-green-color { color: #4caf50; } .yoo-red-color { color: #f44336; } .yoo-orange-color { color: #ff9800; } .yoo-gray-color { color: #9e9e9e; } .yoo-blue-gray-color { color: #607d8b; } .yoo-base-bg1 { background-color: rgba(0, 0, 0, 0.87); } .yoo-base-bg2 { background-color: rgba(0, 0, 0, 0.6); } .yoo-base-bg3 { background-color: rgba(0, 0, 0, 0.38); } .yoo-base-bg4 { background-color: #eaeaea; } .yoo-base-bg5 { background-color: rgba(0, 0, 0, 0.02); } .yoo-base-bg6 { background-color: rgba(0, 0, 0, 0.004); } .yoo-base-color1 { color: rgba(0, 0, 0, 0.87); } .yoo-base-color2 { color: rgba(0, 0, 0, 0.6); } .yoo-base-color3 { color: rgba(0, 0, 0, 0.38); } .yoo-base-color4 { color: #eaeaea; } .yoo-base-color5 { color: rgba(0, 0, 0, 0.02); } .yoo-base-color6 { color: rgba(0, 0, 0, 0.004); } .yoo-white-bg { background-color: #fff; } .yoo-gray-bg { background-color: rgba(0, 0, 0, 0.02); } .yoo-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .yoo-height-100p { height: 100%; } .yoo-box-50 { height: 50px; width: 50px; border-radius: 50%; overflow: hidden; font-size: 14px; font-weight: 500; text-transform: uppercase; -webkit-box-flex: 0; -ms-flex: none; flex: none; } .yoo-box-50 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .yoo-padd-lr-30 { padding-left: 30px; padding-right: 30px; } .yoo-padd-lr-20 { padding-left: 20px; padding-right: 20px; } .yoo-padd-lr-15 { padding-left: 15px; padding-right: 15px; } .yoo-content.yoo-style1 { padding-left: 270px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; min-height: calc(100vh - 60px); overflow: hidden; } .yoo-content.yoo-style1.yoo-sp-content-container { min-height: calc(100vh - 103px); } .material-icons { font-size: inherit; } .yoo-card-content-height1 { height: 419px; overflow: auto; } .yoo-opacity9 { opacity: 0.9; } .yoo-opacity8 { opacity: 0.8; } .yoo-opacity7 { opacity: 0.7; } .yoo-opacity6 { opacity: 0.6; } .yoo-opacity5 { opacity: 0.5; } .yoo-opacity4 { opacity: 0.4; } .yoo-opacity3 { opacity: 0.3; } .yoo-opacity2 { opacity: 0.2; } .yoo-opacity1 { opacity: 1; } .yoo-navigation.yoo-style1 { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; border-radius: 4px; border: 1px solid #eaeaea; } .yoo-navigation.yoo-style1 .yoo-prev, .yoo-navigation.yoo-style1 .yoo-next { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 18px; height: 30px; width: 30px; } .yoo-navigation.yoo-style1 .yoo-prev:hover, .yoo-navigation.yoo-style1 .yoo-next:hover { background-color: rgba(0, 0, 0, 0.02); } .yoo-navigation.yoo-style1 .yoo-prev { border-right: 1px solid #eaeaea; } .yoo-search.yoo-style2 { position: relative; min-width: 400px; background-color: #fff; border-radius: 4px; } .yoo-search.yoo-style2 input { border: 1px solid #eaeaea; height: 30px; border-radius: 4px; padding: 5px 10px; padding-left: 32px; width: 100%; font-size: 14px; background-color: transparent; color: rgba(0, 0, 0, 0.6); } .yoo-search.yoo-style2 input:focus { outline: none; } .yoo-search.yoo-style2 input::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.38); } .yoo-search.yoo-style2 input::-moz-placeholder { color: rgba(0, 0, 0, 0.38); } .yoo-search.yoo-style2 input:-ms-input-placeholder { color: rgba(0, 0, 0, 0.38); } .yoo-search.yoo-style2 input:-moz-placeholder { color: rgba(0, 0, 0, 0.38); } .yoo-search.yoo-style2 button { position: absolute; top: 0; font-size: 20px; padding: 0; border: 0; background: transparent; height: 100%; width: 32px; cursor: pointer; color: rgba(0, 0, 0, 0.38); padding-top: 2px; } .yoo-online-status { height: 6px; width: 6px; background-color: #b5b5b5; display: inline-block; border-radius: 50%; } .yoo-online-status.yoo-live { background-color: #2196f3; } .yoo-uikits-heading { border-bottom: 1px solid #eaeaea; padding: 26px 0 24px; } .yoo-uikits-heading .yoo-uikits-title { font-size: 28px; font-weight: 400; margin-bottom: 0; margin-right: 20px; } .yoo-breadcamb.yoo-style1 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 4px; letter-spacing: 0; font-family: "Roboto", sans-serif; } .yoo-breadcamb.yoo-style1 li:not(:last-child) { padding-right: 13px; margin-right: 11px; position: relative; } .yoo-breadcamb.yoo-style1 li:not(:last-child):before { content: ''; height: 7px; width: 7px; border: 2px solid rgba(0, 0, 0, 0.38); position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); right: -1px; top: 7px; border-left: none; border-bottom: none; } .yoo-bg { background-repeat: no-repeat; background-size: cover; background-position: center; } .yoo-overlay.yoo-style1 { position: absolute; height: 100%; width: 100%; left: 0; top: 0; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.7))); background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); } .yoo-vertical-middle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100%; } .yoo-vertical-middle-in { width: 100%; -webkit-box-flex: 0; -ms-flex: none; flex: none; } .yoo-gutter-less { padding-left: 1px; } .yoo-gutter-less .row > div { padding: 0; margin-left: -1px; } .yoo-border { border: 1px solid #eaeaea; } .yoo-custom-input-area { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } .yoo-custom-input-area .yoo-custom-input-field { height: 100%; width: 100%; padding: 5px 0; font-size: 16px; line-height: 1.6em; } .yoo-custom-input-area .yoo-custom-input-field:focus { outline: none; } .yoo-custom-input-area [contentEditable=true]:empty:not(:focus):before { content: attr(data-placeholder); color: rgba(0, 0, 0, 0.38); } .yoo-mobile-toggle-btn { font-size: 24px; color: rgba(0, 0, 0, 0.38); display: none; } .yoo-with-mobile-toggle { position: relative; } .nicescroll-rails div { background-color: #eaeaea !important; } @media screen and (max-width: 1199px) { .yoo-content.yoo-style2 { padding-left: 0px; } .yoo-mobile-toggle-btn { display: -webkit-box; display: -ms-flexbox; display: flex; } .yoo-mobile-toggle-btn + .yoo-search.yoo-style2 { display: none; } .yoo-mobile-toggle-btn.active + .yoo-search.yoo-style2 { display: block; } .yoo-search.yoo-style2 { position: absolute; top: 110%; right: 0; z-index: 100; } .yoo-contact-wrap.yoo-style1 .yoo-search.yoo-style2 { position: initial; min-width: 100%; } } @media screen and (max-width: 575px) { .yoo-hide-mobile { display: none; } } .yoo-card-heading .yoo-card-settings { margin-right: -8px; } /* Ensure that the demo table scrolls */ .yoo-side-footer { background-color: #101010; overflow: hidden; } .yoo-side-footer .yoo-footer-img { width: calc(100% + 200px); position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: -60px; } .yoo-footer-btn { color: #fff; border: 2px solid rgba(255, 255, 255, 0.7); border-radius: 4px; padding: 0.4em 2.4em; font-size: 16px; line-height: 1.6em; } .yoo-footer-btn:hover { color: #101010; background-color: #fff; border-color: #fff; -webkit-transform: translateY(-1px); transform: translateY(-1px); } .yoo-dropdown { list-style: none; position: absolute; width: 280px; background: #fff; left: 0; top: 100%; padding: 10px 0; opacity: 0; visibility: hidden; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; border-radius: 4px; display: block; z-index: 6; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); } .yoo-fade-up .yoo-desktop-nav .yoo-nav-list .yoo-dropdown.yoo-style1 .yoo-has-children > a { position: relative; } .yoo-fade-up .yoo-desktop-nav .yoo-nav-list .yoo-dropdown.yoo-style1 .yoo-has-children > a:before { content: ''; position: absolute; height: 6px; width: 6px; border: 1px solid rgba(0, 0, 0, 0.38); border-left: 0; border-top: 0; right: 15px; top: 15px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .custom-control-input:focus ~ .custom-control-label::before, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus { -webkit-box-shadow: none; box-shadow: none; } .modal-content { background-color: #fff; } .modal-header, .modal-footer { border-color: #eaeaea; } .close, .close:hover { text-shadow: none; color: rgba(0, 0, 0, 0.6); opacity: 0.7; } .close:hover { opacity: 1; } .table { color: rgba(0, 0, 0, 0.6); } .yoo-card-heading-right { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .yoo-card-heading-right .yoo-search.yoo-style2 { min-width: 180px; margin-right: 10px; } .yoo-card-heading-right .yoo-search.yoo-style2 input { height: 28px; } .yoo-card-heading-right .yoo-search.yoo-style2 button { top: 1px; font-size: 18px; } .badge-pill { border-radius: 1.6em; } .highlight-wrap { padding: 30px; position: relative; background-color: #f7f7f9; } .highlight { background-color: rgba(0, 0, 0, 0.02); padding: 15px 20px; } .highlight pre { padding: 0; margin-top: 0; margin-bottom: 0; background-color: transparent; border: 0; } .highlight pre code { font-size: inherit; color: #212529; } .highlight .nt { color: #2f6f9f; } .highlight .na { color: #4f9fcf; } .highlight .s { color: #d44950; } .bg-primary { background-color: #3f51ae !important; } .bg-blue-gray { background-color: #607d8b !important; } .bg-secondary { background-color: #673ab6 !important; } .bg-success { background-color: #4caf50 !important; } .bg-danger { background-color: #f44336 !important; } .bg-warning { background-color: #ff9800 !important; } .bg-info { background-color: #2196f3 !important; } .bg-dark { background-color: rgba(0, 0, 0, 0.87) !important; } .bg-light { background-color: rgba(0, 0, 0, 0.02) !important; } .bg-primary-off70 { background-color: rgba(63, 81, 174, 0.7) !important; } .bg-secondary-off70 { background-color: rgba(103, 58, 182, 0.7) !important; } .bg-success-off70 { background-color: rgba(76, 175, 80, 0.7) !important; } .bg-danger-off70 { background-color: rgba(244, 67, 54, 0.7) !important; } .bg-warning-off70 { background-color: rgba(255, 152, 0, 0.7) !important; } .bg-info-off70 { background-color: rgba(33, 150, 243, 0.7) !important; } .bg-dark-off70 { background-color: rgba(0, 0, 0, 0.7) !important; } .bg-light-off70 { background-color: rgba(0, 0, 0, 0.004) !important; } .border-primary { border-color: #3f51ae !important; } .border-blue-gray { border-color: #607d8b !important; } .border-secondary { border-color: #9e9e9e !important; } .border-success { border-color: #2196f3 !important; } .border-danger { border-color: #4caf50 !important; } .border-warning { border-color: #f44336 !important; } .border-info { border-color: #673ab6 !important; } .border-dark { border-color: rgba(0, 0, 0, 0.87) !important; } .border-light { border-color: #eaeaea !important; } .text-primary, .text-primary .card-title { color: #3f51ae !important; } .text-blue-gray, .text-blue-gray .card-title { color: #607d8b !important; } .text-secondary, .text-secondary .card-title { color: #673ab6 !important; } .text-success, .text-success .card-title { color: #2196f3 !important; } .text-danger, .text-danger .card-title { color: #f44336 !important; } .text-warning, .text-warning .card-title { color: #ff9800 !important; } .text-info, .text-info .card-title { color: #2196f3 !important; } .text-dark, .text-dark .card-title { color: rgba(0, 0, 0, 0.87) !important; } .blockquote { font-size: 18px; line-height: 1.6em; } .blockquote-footer { color: rgba(0, 0, 0, 0.38); } #accordion .card-header { padding: 0; background-color: transparent; } #accordion .card-body { padding: 15px 15px; letter-spacing: 0.18px; border-bottom: 1px solid #eaeaea; } #accordion .btn { -webkit-box-shadow: none; box-shadow: none; padding: 13px 20px; display: block; width: 100%; text-align: inherit; font-size: 16px; text-transform: initial; font-weight: 400; color: #3f51ae; background-color: rgba(0, 0, 0, 0.02); border-radius: 4px 4px 0 0; letter-spacing: 0.18px; box-shadow: none !important; } #accordion .btn.collapsed { color: #3f51ae; background-color: rgba(0, 0, 0, 0.02); border-radius: 4px; } #accordion .btn:hover, #accordion .btn:focus { text-decoration: none; } #accordion .card:not(:last-child) { margin-bottom: 10px; } .close { display: -webkit-box; display: -ms-flexbox; display: flex; } .rounded-sm { border-radius: 4px !important; } .rounded-lg { border-radius: 10px !important; } .bd-example-row .row > .col, .bd-example-row .row > [class^=col-] { padding-top: .75rem; padding-bottom: .75rem; background-color: rgba(86, 61, 124, 0.15); border: 1px solid rgba(86, 61, 124, 0.2); } .bd-example-row .row + .row { margin-top: 1rem; } code { color: #f44336; } .bd-example { border-color: rgba(0, 0, 0, 0.02); } .bd-lead { font-size: 18px; line-height: 1.6em; font-weight: 400; } .bd-example-border-utils [class^=border], .bd-example-border-utils [class^=rounded] { display: inline-block; width: 5rem; height: 5rem; margin: .25rem; background-color: rgba(0, 0, 0, 0.02); } .bd-example > .close { float: none; } .shadow { -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075), 0 2px 2px rgba(0, 0, 0, 0.075), 0 4px 4px rgba(0, 0, 0, 0.075), 0 6px 6px rgba(0, 0, 0, 0.075), 0 8px 8px rgba(0, 0, 0, 0.075) !important; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075), 0 2px 2px rgba(0, 0, 0, 0.075), 0 4px 4px rgba(0, 0, 0, 0.075), 0 6px 6px rgba(0, 0, 0, 0.075), 0 8px 8px rgba(0, 0, 0, 0.075) !important; } .shadow-lg { -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 2px rgba(0, 0, 0, 0.05), 0 4px 4px rgba(0, 0, 0, 0.05), 0 6px 6px rgba(0, 0, 0, 0.05), 0 8px 8px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.05), 0 12px 12px rgba(0, 0, 0, 0.05), 0 14px 14px rgba(0, 0, 0, 0.05), 0 16px 16px rgba(0, 0, 0, 0.05) !important; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 2px rgba(0, 0, 0, 0.05), 0 4px 4px rgba(0, 0, 0, 0.05), 0 6px 6px rgba(0, 0, 0, 0.05), 0 8px 8px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.05), 0 12px 12px rgba(0, 0, 0, 0.05), 0 14px 14px rgba(0, 0, 0, 0.05), 0 16px 16px rgba(0, 0, 0, 0.05) !important; } .shadow-sm { -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 4px rgba(0, 0, 0, 0.1) !important; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 4px rgba(0, 0, 0, 0.1) !important; } .bd-highlight { background-color: rgba(0, 0, 0, 0.02); border: 1px solid #eaeaea; } .bd-content h2 { font-size: 32px; font-weight: 500; } .bd-content ul, .bd-example ul { list-style-type: disc; } .bd-content li, .bd-example li { font-size: 15px; line-height: 1.6em; } .bd-example-row .row > .col, .bd-example-row .row > [class^=col-] { padding-top: .75rem; padding-bottom: .75rem; background-color: rgba(0, 0, 0, 0.02); border: 1px solid #eaeaea; } kbd { background-color: rgba(0, 0, 0, 0.87); } .yoo-icons-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .yoo-icons-wrap li { width: 16.666667%; padding: 0 15px; } .yoo-icons-wrap .yoo-icons-wrap-in { text-align: center; border: 1px solid #eaeaea; border-radius: 4px; margin-bottom: 30px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .yoo-icons-wrap .yoo-icons-wrap-in:hover { -webkit-transform: translateY(-6px); transform: translateY(-6px); } .yoo-icons-wrap i { display: block; font-size: 40px; padding: 30px 0; } .yoo-icons-wrap .yoo-icons-classes { font-size: 14px; border-top: 1px solid #eaeaea; display: block; padding: 10px 0; } .yoo-add { padding: 20px; position: absolute; bottom: 0px; left: 0; width: 100%; z-index: 10; background-color: #fff; } .yoo-add .yoo-add-in { padding: 25px 15px; display: block; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; background-color: #f2f2f6; border: 1px solid #eaeaea; border-radius: 4px; text-align: center; } .yoo-add .yoo-add-thumb { display: block; -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15); width: 160px; margin: auto; margin-bottom: 16px; } .yoo-add .yoo-add-title { font-size: 16px; margin: 0; font-weight: 500; margin-bottom: 16px; } .yoo-sidebar-active .yoo-add { display: none; } .yoo-sidebar-active .yoo-add + .yoo-sidebarheader-in { height: 100% !important; } @media screen and (min-width: 991px) { .yoo-add + .yoo-sidebarheader-in { height: calc(100% - 260px) !important; } } @media screen and (max-width: 991px) { .yoo-add { display: none; } } @media screen and (max-width: 991px) { .tt-sticky-content-in { width: 100% !important; left: 0 !important; position: initial !important; } .tt-sticky-content-middle, .tt-sticky-content { height: initial !important; } .yoo-card-content-height1 { height: initial; } .yoo-icons-wrap li { width: 33.333333%; } } @media screen and (max-width: 575px) { .yoo-icons-wrap li { width: 50%; } } @media screen and (max-width: 400px) { .yoo-icons-wrap li { width: 100%; } } /*========== End General Style ==========*/ /*========== Start Footer ==========*/ .yoo-footer.yoo-style1 .yoo-footer-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-top: 1px solid #eaeaea; padding: 14px 0; } .yoo-footer-nav li:not(:last-child) { margin-right: 30px; } .yoo-footer-nav a { font-weight: 500; color: rgba(0, 0, 0, 0.6); } .yoo-footer-nav a:hover { color: #3f51ae; } .yoo-copyride { font-size: 13px; color: rgba(0, 0, 0, 0.6); line-height: 1.6em; } .yoo-copyride a { color: #3f51ae; } .yoo-copyride a:hover { color: rgba(63, 81, 174, 0.8); } .yoo-sticky-footer { position: fixed; width: 100%; left: 0; bottom: 0; padding-left: 270px; background-color: #fff; z-index: 1; } .yoo-sticky-footer .container { position: relative; } .yoo-sticky-footer:before { content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.02); } @media screen and (max-width: 1199px) { .yoo-sticky-footer { padding-left: 0; } } @media screen and (max-width: 991px) { .yoo-footer.yoo-style1 .yoo-footer-content { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } .yoo-sticky-footer { position: initial; } } /*========== End Footer ==========*/ /*========== Start Smooth Scrollbar Style ==========*/ scrollbar, [scrollbar], [data-scrollbar] { display: block; position: relative; overflow: scroll; } scrollbar .scroll-content, [scrollbar] .scroll-content, [data-scrollbar] .scroll-content { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); will-change: transform; } scrollbar.scrolling .scroll-content, [scrollbar].scrolling .scroll-content, [data-scrollbar].scrolling .scroll-content { pointer-events: none; } scrollbar.scrolling .scroll-content .scroll-content, [scrollbar].scrolling .scroll-content .scroll-content, [data-scrollbar].scrolling .scroll-content .scroll-content { pointer-events: auto; } scrollbar .scrollbar-track, [scrollbar] .scrollbar-track, [data-scrollbar] .scrollbar-track { position: absolute; opacity: 0; z-index: 1; -webkit-transition: opacity 0.5s 1s ease-out, background 0.5s ease-out; transition: opacity 0.5s 1s ease-out, background 0.5s ease-out; background: none; } scrollbar .scrollbar-track.show, [scrollbar] .scrollbar-track.show, [data-scrollbar] .scrollbar-track.show, scrollbar .scrollbar-track:hover, [scrollbar] .scrollbar-track:hover, [data-scrollbar] .scrollbar-track:hover { opacity: 1; -webkit-transition-delay: 0s; transition-delay: 0s; } scrollbar .scrollbar-track:hover, [scrollbar] .scrollbar-track:hover, [data-scrollbar] .scrollbar-track:hover { background: transparent; } scrollbar .scrollbar-track-x, [scrollbar] .scrollbar-track-x, [data-scrollbar] .scrollbar-track-x { bottom: 0; left: 0; width: 100%; height: 8px; } scrollbar .scrollbar-track-y, [scrollbar] .scrollbar-track-y, [data-scrollbar] .scrollbar-track-y { top: 0; right: 0; width: 6px; height: 100%; } scrollbar .scrollbar-thumb, [scrollbar] .scrollbar-thumb, [data-scrollbar] .scrollbar-thumb { position: absolute; top: 0; left: -5px; width: 6px; height: 8px; background: transparent; border-radius: 4px; } [data-scrollbar] .scrollba