/*
Theme Name: TT TARKVARA 2025
Theme URI: tttarkvara.ee
Description: TT TARKVARA 2025
Author: Rando Rooberg | Arvutinurk.ee kiired ja vihased kodulehed ja e-poed
Author URI: https://www.linkedin.com/in/rando-rooberg-7aa088239/
Version: 1.0
License: Arvutinurk.ee | Mõeldud kasutamiseks ainult tttarkvara.ee kodulehel
*/

* { box-sizing: border-box;}
body {background-color: #ffffff; font-size: 15px; line-height: 2; color: #1D1D1D000; font-family: 'Open Sans', sans-serif; font-weight: 300;  }

img {max-width: 100%; height: auto;}

img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

.table_wrapp {overflow: auto;}
table, td, th {border: 1px solid #ccc; text-align: left;}
table {border-collapse: collapse; width: 100%;}
th, td {padding: 15px!important;}

iframe, video  {width: 100%; margin: 0; padding: 0;}

figure {margin: 0!important;}

strong {font-weight: 700;}

input, select, textarea {width: 100%!important; padding: 17px!important; border: 1px solid #ccc!important; box-sizing: border-box!important; margin-bottom: 10px!important; -webkit-appearance: none; border-radius: 0;}
input[type=submit] {background-color: #001B54!important; font-weight: 700!important; color: #fff!important; border: 1px solid #001B54!important; width: 50%!important; float: right!important; cursor: pointer; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-appearance: none; border-radius: 0;}
input[type=submit]:hover {background-color: #000!important; color: #fff!important;} 
textarea {height: 175px;}

input:focus, select:focus, textarea:focus, option:focus {outline: none!important;}

button {background-color: #001B54; font-weight: 700; margin: 0!important; color: #fff; border: 1px solid #001B54; cursor: pointer; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
button:hover {background-color: #000; color: #fff;}

.wp-block-buttons>.wp-block-button {width: 100%!important;}
.wp-block-button__link {background-color: #001B54!important; border-radius: 10px!important; padding: 25px!important; line-height: 1.2!important; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.wp-block-button__link:hover {background-color: #000!important; text-decoration: none; color: #fff!important;}

.wpcf7-form {display: block!important; margin: 0!important;}
div.wpcf7-mail-sent-ng, div.wpcf7-aborted, div.wpcf7-mail-sent-ok {margin-top: 25px!important; float: left; width: 100%;}
.screen-reader-response ul li{ display:none; }
.wpcf7-validation-errors { display:none; }
.screen-reader-response { display:none; }
form.invalid input.wpcf7-not-valid, select.wpcf7-not-valid, textarea.wpcf7-not-valid{border:3px solid red!important;}
div.wpcf7-validation-errors {display:none!important;}
.wpcf7-not-valid-tip {display: none !important;}
.wpcf7 form.invalid .wpcf7-response-output {margin-top: 75px;}
.wpcf7 form.sent .wpcf7-response-output {margin-top: 75px;}
.wpcf7 form .wpcf7-response-output {margin: 55px 0 0 0!important;}

label {font-weight: 700;}

blockquote {background: #f9f9f9; border-left: 10px solid #ccc; margin: 1.5em 10px; padding: 0.5em 10px; quotes: "\201C""\201D""\2018""\2019";}
blockquote:before {color: #ccc; content: "\""; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em;}
blockquote a{text-decoration: none; background: #eee; cursor: pointer; padding: 0 3px; color: #c76c0c;}
blockquote a:hover{color: #666;}
blockquote em{font-style: italic;}

h1, h2, h3, h4, h5, h6 {color: #000066; line-height: 1.2; font-family: 'Open Sans', sans-serif; font-weight: 300;}

h1 { font-size: 30px;}
h2 { font-size: 25px;}
h3 { font-size: 21px;}
h4 { font-size: 21px; }
h5 { font-size: 20px; }
h6 { font-size: 15px; }

a {color: #4E74FF; font-weight: 700; text-decoration: none;}
a:hover {color: #000; text-decoration: underline; }

.container {position: relative; width: 1200px; max-width: 100%; padding: 0 10px;}

#header {display: flex; justify-content: center; background-color: #f5f8fa; padding: 10px 0;}
#header .container {display: flex; flex-wrap: wrap; align-items: center;}

#logo {position: relative;}
#logo img {max-width: 85%!important;}	

#navigation {margin-left: auto;}
#navigation ul {padding: 0;}
#navigation ul li {display: inline-block;}
#navigation ul li a {text-decoration: none; padding: 15px 10px; color: #1D1D1D; font-size: 15px; font-weight: 300; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
#navigation ul li a:hover {text-decoration: underline;}

.sub-menu {display: none;}

#page {display: flex; justify-content: center;}
#page .container {margin: 25px 10px; padding: 0 10px; display: flex; flex-wrap: wrap;}

#frontpage-cta {display: flex; justify-content: center; margin-top: 75px;}
#frontpage-cta .container {text-align: center;}
#frontpage-cta h2 {font-size: 50px; color: #EB0F0F!important;}

#frontpage-check-service {display: flex; justify-content: center; margin-top: 75px;}
#frontpage-check-service .container {display: flex; flex-wrap: wrap; align-items: center;}

#frontpage-check-service .container a {display: flex; align-items: center; width: 31.66%; margin-left: 2.5%; position: relative; text-decoration: none; text-align: center; font-weight: 300; padding: 25px 0; height: 350px;}
#frontpage-check-service .container a:first-of-type {margin-left: 0;}
#frontpage-check-service .container a:hover {color: #fff;}
#frontpage-check-service .container p {z-index: 1; line-height: 1.5; position: relative; color: #fff; margin: 0; padding: 0 10px; }
#frontpage-check-service .container h3 {font-size: 30px; z-index: 1; position: relative; color: #fff; padding: 10px 10px 0;}

#frontpage-check-service .overlay {background: rgba(0,0,102,.6); position: absolute; display: flex; align-items: center; justify-content: center; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
#frontpage-check-service .overlay:hover {background: #000066;}

#catarc-intro {width: 100%; margin-top: 36px; margin-bottom: 50px;}
#catarc-intro h2 {margin: 0; font-size: 30px;}

#news-feed-title {display: none;}

.news {width: 100%; margin-top: 43px; background-color: #F5F8FA; padding: 10px 15px;}
.news-title {width: 100%; margin-top: 12px; margin-bottom: 15px;}
.news-title h1 {width: 100%; text-transform: uppercase; margin-bottom: 0; font-size: 30px;}
.news-title a {font-weight: 300; color: #000066; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.news-title a:hover {color: #000; text-decoration: none;}

.news-meta {width: 100%; margin-bottom: 15px; font-size: 13px;}
.news-meta .material-icons {vertical-align: middle; color: #666666; font-size: 21px!important;}

.news-thumbnail {width: 100%;}
.news-thumbnail img {width: 100%!important; height: auto!important;}

.news-preview {width: 100%; color: #666666; font-size: 13px;}

#page-content {width: 65%;}

#page-content-full {width: 100%; }

.single-post #page-content, .page #page-content {margin-top: 15px;}

#single-post-meta {color: #666666; border-top: 1px solid #ccc;}
#posted-at-cat {margin: 10px 0; display: flex; flex-wrap: wrap; width: 100%;}
#slasher {margin: 0 5px;}
#next-prev-post-url {width: 100%; display: flex; flex-wrap: wrap;}
#next-news-url {margin-left: auto;}

.float-wrap {width: 100%; display: flex; flex-wrap: wrap; margin-top: 10px;}
.float-wrap h2 {margin-bottom: 0; font-size: 30px;}
.float-left {width: 45%;}
.float-right {width: 45%; margin-left: auto;}

#error-page h1 {margin-bottom: 25px;}
#error-page #s {width:70%!important;}
#error-page #searchsubmit {width:30%!important;}

#right-sidebar {width: 30%; margin-left: auto; margin-top: 43px; color: #666666;}
#right-sidebar h4 {background-color: #000099; color: #fff; border-radius: 5px; padding: 10px; text-transform: uppercase; font-size: 25px; position: relative; width: 100%; text-align: center;}
#right-sidebar ul {list-style: none; margin: -10px 0 0 0; padding: 0;}
#right-sidebar ul li a {color: #666666; font-weight: 300; display: block; margin-top: 10px;}
.search #right-sidebar {margin-top: 10px;}

#right-sidebar input {width:70%; margin-bottom: 0!important;}
#right-sidebar button {width:30%;}

#right-sidebar figure {margin-top: 0!important;}
#right-sidebar img {filter: grayscale(100%); -webkit-transition-duration: 0.4s; transition-duration: 0.4s; max-width: 80%!important;}
#right-sidebar img:hover {filter: grayscale(0%);}

.wp-block-search__label {display: none;}

#search-page {margin-top: 43px;}
#search-page input, #error-page input {width:70%!important; margin-bottom: 0!important;}
#search-page button, #error-page button {width:30%!important;}
#searchresult-info h2 {margin-bottom: 0; font-size: 30px;}

#post-pagination {width: 100%; display: flex; flex-wrap: wrap; margin-top: 100px;}
.nav-next {margin-left: auto;}

.nav-previous a, .nav-next a {padding: 15px 10px; color: #fff; background-color: #001B54; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.nav-previous a:hover, .nav-next a:hover {background-color: #000; text-decoration: none;}

#footer {display: flex; justify-content: center; background-color: #f5f8fa; padding: 25px 0; font-size: 13px; margin-top: 100px;}
#footer .container {display: flex; flex-wrap: wrap;}

.home #footer, .error404 #footer {position: fixed; left: 0; bottom: 0; width: 100%;}

.footer-left {}
.footer-right {margin-left: auto; text-align: right;}

@media (max-width: 1200px) {
#slasher {display: none;}
#single-post-meta-cat {width: 100%;}
#frontpage-check-service .container a {height: 400px;}	
}

@media (max-width: 948px) {
#frontpage-check-service .container a {min-height: 475px;}	
}

@media (max-height: 1200px) {
.home #footer, .error404 #footer {margin-top: 100px; position: static!important;}	
}

@media (max-width: 880px) {
#logo img {max-width: 75%!important;}	

.menuicon {cursor: pointer; margin-left: auto; padding: 5px;}
.bar1, .bar2, .bar3 {width: 40px; height: 4px; background-color: #1D1D1D; margin: 7px 0;}
.change .bar1 {opacity: 0;}
.change .bar2 {}
.change .bar3 {opacity: 0; }

#navigation {width: 100%; display: none; overflow: hidden; }
#navigation ul {padding: 0; margin: 0; list-style: none;}
#navigation ul li {width: 100%;}
#navigation ul li a{width: 100%; display: inline-block; text-decoration: none; color: #000; text-transform: uppercase; font-weight: 400; padding: 10px 0; font-size: 21px;}
#navigation ul li a:hover {border-bottom: none;}
	
#navigation .with_sub {position: relative;}
#navigation .with_sub:after {content: '\002B'; color: #000066; cursor: pointer; position: absolute; font-weight: bold; font-size: 30px; top: -22px; padding: 0 15px; right: -15px;}

#navigation .sub-menu {margin: 0; padding: 0; display: none;}
#navigation .sub-menu li {width: 100%!important;}
#navigation .sub-menu li a {font-weight: 400; text-transform: none;}

#frontpage-cta {margin-top: 10px;}
.home #page .container {margin: 0;}

#frontpage-check-service {margin: 25px 0 0 0;}
#frontpage-check-service .container a {width: 100%; margin: 25px 0 0 0; height: 350px;}
#frontpage-check-service .container a:first-of-type {margin: 0;}
#frontpage-check-service .overlay:hover {background: rgba(0,0,102,.6);}

#right-sidebar {width: 100%; order: 2;}

#page-content {width: 100%; order: 1;}
	
#page .container {margin: 0 0 100px 0;}

.float-left {width: 100%;}
.float-right {width: 100%;}
	
#news-feed-title {display: block; margin-top: 36px; margin-bottom: 36px;}
#news-feed-title h2 {font-size: 30px;}
	
.news {margin-top: 25px;}

#post-pagination {margin-top: 50px;}

.home #footer, .error404 #footer {margin-top: 100px; position: static!important;}	
#footer {margin: 0;}
.footer-left {width: 100%; text-align: center;}
.footer-right {width: 100%; margin: 25px 0 0 0; text-align: center;}
}

@media (max-width: 615px) {

}		

@media (max-width: 450px) {
#frontpage-cta h2 {font-size: 8vw; color: #000066;}
#page-content h1 {font-size: 8vw;} 
.news-title h1 {font-size: 8vw!important;} 
}

@media (max-width: 380px) {
.nav-previous, .nav-next {width: 100%;}
.nav-next {margin-top: 25px;}
#post-pagination a {display: block; text-align: center;}
}