body { margin:0; } .navbar-dark .navbar-nav .nav-link { color: white; cursor: pointer; text-decoration:none; } .nav-top { line-height:40px; background-color: #C4C4C4; } .website_title{ font-family: Roboto; font-style: normal; font-weight: normal; font-size: 30px; color: #000000; } .navbar-nav > li{ float: none; display: inline-block; width: 200px; margin: 0 auto; text-align: center; } .navbar-nav > li a{ font-size: 20px; } .main-page { margin-top: 200px; } .page-title { font-family: Roboto; font-style: normal; font-weight: bold; font-size: 36px; color: #000000; } form { margin-top: 70px; } .cmn-toggle { position: absolute; margin-left: 0px; visibility: hidden; } .cmn-toggle + label { display: block; position: relative; cursor: pointer; outline: none; user-select: none; } input.cmn-toggle-round-flat + label { padding: 2px; width: 60px; height: 30px; background-color: #C0C0C0; border-radius: 60px; transition: background 0.4s; } input.cmn-toggle-round-flat + label:before, input.cmn-toggle-round-flat + label:after { display: block; position: absolute; content: ""; } input.cmn-toggle-round-flat + label:before { top: 2px; left: 2px; bottom: 2px; right: 2px; background-color: #fff; border-radius: 60px; transition: background 0.4s; } input.cmn-toggle-round-flat + label:after { top: 4px; left: 4px; bottom: 4px; width: 24px; background-color: #dddddd; border-radius: 52px; transition: margin 0.4s, background 0.4s; } input.cmn-toggle-round-flat:checked + label { background-color: #C0C0C0; } input.cmn-toggle-round-flat:checked + label:after { margin-left: 27px; background-color: #008CBA; } table { display: inline-block; } .main-top span, .main-bottom span { font-size: 30px; } .main-bottom { margin-top:100px; } .main-top select, .main-bottom select { width: 75px; height: 35px; font-size: 20px; border-radius: 5px; } .page-bottom { margin-top: 100px; } .form-control { background: #008CBA; border: 1px solid #CFCFCF; box-sizing: border-box; border-radius: 5px; width: 120px; height: 58px; text-align: center; line-height: 50px; color: #FFFFFF; display: inline-block; } @media(max-width:373px){ } @media(max-width:577px){ } @media(min-width:576px){ } @media(min-width:768px){ .navbar-nav > li { margin-left: 0px; } .navbar-nav .li-block { display:none; } } @media(min-width:991px){ .navbar-nav > li { margin-left: 20px; } .navbar-nav .li-block { display:none; } } @media(min-width:1200px){ .navbar-nav > li { margin-left: 0px; } .navbar-nav .li-block { display: inline-block; width: 100px; } } @media(min-width:1400px){ .navbar-nav .li-block { display: inline-block; width: 250px; } } @media(min-width:1689px) { .navbar-nav > li { margin-left: 0px; } .navbar-nav .li-block { display: inline-block; width: 580px; } }