/* ==================================================== * [Master Stylesheet] Theme Name : Version : Author : Author URI : ==================================================== TOC 1. PRIMARY STYLES 2. COMMONS FOR PAGE DESIGN 3. HEADER 4. INTRO SECTION 5. PORFOLIO SECTION 6. ABOUT SECTION 7. EXPERIENCE SECTION 8. EDUCATION SECTION 9. COUNTER SECTION 10. FOOTER ==================================================== /* --------------------------------- 1. PRIMARY STYLES --------------------------------- */ html{ font-size: 100%; height: 100%; overflow-x: hidden; margin: 0px; padding: 0px; touch-action: manipulation; } body{ font-size: 15px; font-family: 'Poppins', serif; margin: 0; font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; word-wrap: break-word; line-height: 1; margin: 0 50px; padding: 60px 0; height: 100vh; width: calc(100% - 100px); position: relative; z-index: 1; color: #333; } h1, h2, h3, h4, h5, h6, p, a, ul, span, li, img, inpot, button{ margin: 0; padding: 0; } h1,h2,h3,h4,h5,h6{ line-height: 1.5; font-weight: inherit; } h1,h2,h3{ font-family: 'Poppins', cursive; } p{ line-height: 1.6; font-size: 1.05em; font-weight: 400; color: #777; } h1{ font-size: 4em; line-height: 1; } h2{ font-size: 2.2em; line-height: 1.1; } h3{ font-size: 1.8em; } h4{ font-size: 1.3em; } h5{ font-size: 1em; } h6{ font-size: .9em; letter-spacing: 1px; } a, button{ display: inline-block; text-decoration: none; color: inherit; line-height: 1; -webkit-transition: all .25s ease-in-out; transition: all .25s ease-in-out; } a:focus, a:active, a:hover, button:focus, button:active, button:hover, a b.light-color:hover{ text-decoration: none; color: #37D583; } b{ font-weight: 600; } img{ width: 100%; } li{ list-style: none; display: inline-block; } span{ display: inline-block; } button{ outline: 0; border: 0; background: none; cursor: pointer; } .icon{ font-size: 1.1em; display: inline-block; line-height: inherit; } [class^="icon-"]:before, [class*=" icon-"]:before{ line-height: inherit; } b.max-bold{ font-weight: 700; } /* --------------------------------- 2. COMMONS FOR PAGE DESIGN --------------------------------- */ .display-table{ display: table; height: 100%; } .display-table-cell{ display: table-cell; vertical-align: middle; } .color-black{ color: #000; } .color-green{ color: #36D98A; } .margin-tb-10{ margin-top: 10px; margin-bottom: 10px; } .margin-b-5{ margin-bottom: 5px; } .margin-b-10{ margin-bottom: 10px; } .margin-b-30{ margin-bottom: 30px; } /* --------------------------------- 3. HEADER --------------------------------- */ header{ position: absolute; top: 0; left: 0; right: 0; height: 60px; text-align: center; z-index: 1000; } header:after{ content:''; clear: both; } header .logo{ float: left; height: 40px; margin: 10px 0; } header .logo img{ height: 100%; width: auto; } header .main-menu{ float: right; } header ul.main-menu > li > a{ height: 100%; line-height: 60px; padding: 0 10px; } header .right-area{ float: right; height: 100%; line-height: 60px; margin-left: 20px; } /* HAMBURGER ICON */ .menu-nav-icon{ display: inline-block; font-size: 30px; line-height: 40px; margin: 10px 0; display: none; cursor: pointer; } /* DROPDOWN MENU STYLING */ header .main-menu li.drop-down{ position: relative; text-align: left; } header .main-menu li.drop-down > ul.drop-down-menu{ display: none; position: absolute; top: 60px; left: 0; min-width: 180px; box-shadow: 0px 3px 10px rgba(0,0,0,.3); background: #fff; } header .main-menu li.drop-down > ul.drop-down-menu li{ display: block; border-top: 1px solid #ddd; } header .main-menu li.drop-down > ul.drop-down-menu li > a{ display: block; padding: 17px 20px; } header .main-menu li i{margin-left: 10px; } /* DROPDOWN HOVER */ header .main-menu li.drop-down a.mouseover + ul.drop-down-menu{ display: block; animation: full-opacity-anim .2s forwards; } @keyframes full-opacity-anim{ 0%{ opacity: 0; } 100%{ opacity: 1; } } /* --------------------------------- 4. SLIDER --------------------------------- */ .slider-section{ height: 100%; width: 100%; position: relative; z-index: 1; } .bg-img{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1; background-size: cover; } .bg-1{ background-image: url(../../images/slider-1-1920x1080.jpg); } .rev_slider_wrapper.fullscreen-container{ height: 100%!important; width: 100%!important; margin: 0 auto!important; left: auto!important;} .forcefullwidth_wrapper_tp_banner{ height: 100%!important; } .tp-bullet{ border-radius: 50px; } .tp-leftarrow, .tp-rightarrow{ border-radius: 50px; -webkit-transform: scale(1.3); transform: scale(1.3); } .visit-btn{ min-width: 150px!important; } /* --------------------------------- 10. FOOTER --------------------------------- */ footer{ position: absolute; bottom: 0; left: 0; right: 0; overflow: hidden; z-index: 10000; text-align: center; } footer .copyright{ font-size: .95em; line-height: 60px; left: 0; position: absolute; } footer .show-thumb-btn{ height: 30px; line-height: 30px; margin: 15px 0; position: relative; } footer .show-thumb-btn:after{ content:''; position: absolute; bottom: 3px; top: 3px; left: -2px; right: -2px; z-index: -1; background: #aaa; -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transform: scaleY(.15); transform: scaleY(.15); -webkit-transition: all .2s ease; transition: all .2s ease; } footer .show-thumb-btn:hover{ color: #fff; } footer .show-thumb-btn:hover:after{ background: #333; -webkit-transform: scaleY(1); transform: scaleY(1); } footer .social-icons{ position: absolute; right: 0; top: 0; } footer .social-icons > li > a{ display: inline-flex; /* aby padding a centerovanie fungovalo */ justify-content: center; /* centrovanie obsahu */ align-items: center; width: 60px; /* minimálna šírka dotykovej plochy */ height: 60px; /* minimálna výška dotykovej plochy */ margin-left: 20px; /* medzera medzi ikonami */ font-size: 24px; /* ikony väčšie = lepšie zacielenie */ line-height: normal; /* odstráni starý line-height problém */ text-decoration: none; }