/*
Theme Name: Bid Agency
Author: SC Studio
Author URI: http://www.scstudio.com.ar
Description: Custom theme for Bid Agency
Version: 1.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
*/

/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p,
a, em, img, strong, sub,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
    font-family: 'Poppins', sans-serif;
    color: #333;
    font-size: 15px;
}

html, body {
	height: 100%;
}

ol, ul {
	list-style: none;
}

a,
a:hover,
a:focus,
a:active,
button,
button:hover,
button:focus,
button:active {
	text-decoration: none;
	outline: none !important;
}

a,
button{
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
    box-shadow: none !important;
}



#header {
    border-bottom: 2px solid #0097b4;
    /*border-top: 10px solid #003c92;*/
}

#top-bar {
    background: #0097b4;
    padding: 7px 0;
    font-size: 14px;
}

#top-bar a {
    color: #FFF;
}

#top-bar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#top-bar ul {
    text-align: right;
}

#top-bar ul li {
    display: inline-block;
    padding-left: 10px;
    font-size: 18px;
}

#header .logo {
    max-width: 300px;
    margin: 30px auto;
    display: block;
}

#content {
    padding: 50px 0 100px;
    text-align: center;
}

#content  h3 {
    position: relative;
    text-transform: uppercase;
    font-size: 20px;
    color: #444;
    margin-bottom: 50px;
}

#content  h3:after {
    position: absolute;
    width: 100px;
    height: 2px;
    left: 50%;
    bottom: -10px;
    margin-left: -50px;
    content: '';
    background: #0097b4;
}

#content p {
  font-size: 15px;
  line-height: 22px;
  max-width: 500px;
  margin: 0 auto;
  font-weight: 500;
    text-align: justify;
    color: #555;
}

#content p.bottom {
    padding-top: 30px;
}

#content p.bottom a {
    color: #0097b4
}

.buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0 100px;
}

.buttons a {
    display: inline-block;
    padding: 20px 40px;
    margin: 0 20px;
    color: #0097b4;
    border: 2px solid #0097b4;
    border-radius: 10px;
    text-transform: uppercase;
}

.buttons a:hover,
.buttons a.active {
    background: #0097b4;
    color: #FFF;
}

#footer {
    background: #003c92;
    text-align: center;
    padding: 15px 0;
}

#footer.fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

form .form-control {
    font-size: 14px;
    box-shadow: none !important;
    outline: none;
    color: #666;
}

/* Hide the file input using
opacity */
[type=file] {
    position: absolute;
    filter: alpha(opacity=0);
    opacity: 0;
}

input,
[type=file] + label {
  border: 1px solid #CCC;
  border-radius: 3px;
  text-align: left;
  padding: 10px;
  width: 150px;
  margin: 0;
  left: 0;
  position: relative;
}

.file label,
[type="file"] + label {
  text-align: center;
  left: 0;
  top: 0;
  background: #FFF;
  color: #0097b4;
  border: none;
  font-size: 13px;
  cursor: pointer;
  width: 100%;
  padding: 6px 0;
    border: 1px solid #ced4da;
    -webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

[type=file] + label:hover {
  background: #0097b4;
    color: #FFF;
}

[type=submit].form-control {
    border: 1px solid #0097b4;
      border-radius: 3px;
      text-align: left;
      padding: 10px;
      width: 150px;
      margin: 0;
      left: 0;
      position: relative;
    display: block;
    background: #0097b4;
    color: #FFF;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    margin: 0 auto;
    -webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

[type=submit].form-control:hover {
    background: #FFF;
    color: #0097b4;
}

textarea.form-control {
    height: 80px;
}

.wpcf7-not-valid-tip {
  font-size: 13px;
  text-align: left;
}

.wpcf7 form .wpcf7-response-output {
    margin: 0;
}

.wpcf7 input[type="file"] {
    width: 100%;
}

.file .wpcf7-form-control-wrap {
  position: relative;
  width: 100%;
  display: block;
}

.wpcf7 form .wpcf7-response-output {
  border-width: 1px !important;
  font-size: 13px !important;
  margin-bottom: 30px;
}

.home #content .button {
    margin: 20px auto 0;
    padding: 5px 10px;
    background: #0097b4;
    color: #FFF;
    display: table;
    border: 1px solid #0097b4;
}

.home #content .button:hover {
    background: #FFF;
    color: #0097b4;
}

.how {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 50px 0 0;
}

.how .boxes {
    position: relative;
    max-width: 150px;
    min-height: 330px;
    margin: 0 45px;
}

.how .boxes:first-child {
    margin-left: 0;
}

.how .boxes:last-child {
    margin-right: 0;
}

.how .boxes svg {
  position: absolute;
  right: -75px;
  top: 20px;
    fill: #0097b4;
    width: 60px;
    height: 60px;
}

.how .boxes path {
    fill: #0097b4;
}

.how .boxes .box.light {
  border: 2px solid #0097b4;
  color: #0097b4;
  border-radius: 7px;
  padding: 20px 15px;
  font-size: 14px;
  line-height: 16px;
  height: 150px;
}

#content .how .boxes .box.light p {
    font-size: 13px;
  line-height: 17px;
    color: #0097b4;
    text-align: left;
}

.how .boxes .box.dark {
  position: absolute;
  left: 18px;
  top: 118px;
  border: 2px solid #0097b4;
  color: #FFF;
  background: #0097b4;
  border-radius: 7px;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 18px;
  z-index: 3;
  width: 166px;
  height: 181px;
}

#content .how .boxes .box.dark p {
  color: #FFF;
  background: #0097b4;
    font-size: 13px;
    line-height: 17px;
    text-align: left;
}

.how-title {
    padding-top: 50px;
}


#footer p {
    color: #FFF;
    font-size: 15px;
}

#footer a {
    color: #FFF;
}

#footer a:hover {
    text-decoration: underline;
}

.pt-serif-regular {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: normal;
}

.pt-serif-bold {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: normal;
}

.pt-serif-regular-italic {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: italic;
}

.pt-serif-bold-italic {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: italic;
}