.body{
    background-color:rgb(250, 250, 250);
}
.main{
    padding-top:2rem;
    margin: 1rem auto 2rem auto;
    overflow-y: hidden;
    position:relative;
}

@media (min-width:1060px){
    .main{
        max-width:1000px;
    }
}

@media (max-width:1060px){
    .main{
        /* max-width: 100%; */
        /* padding:0rem 2rem; */
    }
}

@media (max-width:757px){
    .main{
        margin:0rem auto 2rem auto;
        padding-top:2rem;
    }
}

.main h1{
    text-align:center;
    /* width:max-content; */
    font-size:2.2rem;
    /* padding-left:0.5rem; */
    /* margin:auto; */
    /* border-left:4px solid rgb(231, 111, 13); */
}

.main > p{
    margin:2rem auto;
}

@media (max-width:1060px){
    .main > p{
        margin:2rem 1rem;
    }
}
.contact{
    /*display:grid;
    display:-ms-grid;
    display:-moz-grid;
    grid-template-columns: 50% 50%;
    grid-template-rows:auto;*/
    margin:2rem auto 2rem auto;
    /* border:1px solid black; */
}

@media (max-width:1200px){
    .main{
        width:100%;
    }
}

@media (max-width:1000px){
    .contact{
        grid-template-columns:auto;
        grid-template-rows:auto auto;
        max-width:700px;
    }
}

/* Styles for contact component */
.contact_container{
    padding:1rem 2rem;
}

.contact_location > div{
    margin:1rem 0rem;
    text-align:center;
}

.contact_location > div strong{
    font-weight:500;
}

.contact_location > div > p:first-of-type{
    margin-bottom:0.5rem;
}

.contact_container > p{
    text-align:center;
    margin:3rem auto;
}

.contact_links{
    list-style:none;
    margin:3rem auto 0rem auto;
    /* border:1px solid red; */
    width:max-content;
    
}

@media (max-width:425px){
    .contact_links{
        width:100%;
    }
}

.contact_links img{
    margin:0.5rem;
}

.contact_links a:hover{
    text-decoration:underline;
}

.contact_links li{
    display:grid;
    display:-ms-grid;
    display:-moz-grid;
    grid-template-columns:max-content auto;
    max-width:40vw;
}

@media (max-width:757px){
    .contact_links li{
        max-width:100%;
    }
}

.contact_links li:not(:last-of-type){
    /* border-bottom:1px solid rgb(210, 210, 210); */
    margin-bottom:1.5rem;
}
.contact_links li span{
    /* border:1px solid black; */
    display:block;
    overflow-x:auto;
}

.contact_links li span a{
    display:block;
    word-wrap: break-word;
    /* margin:0.2rem 0.1rem; */
    padding:0.2rem 0.1rem;
    color:rgb(13, 100, 231);
    font-size:1.3rem;
    width:max-content;
}

/* Style for messages */

.form{
    padding:1rem;
}
@media (max-width:425px){
    .form{
        padding:0rem 0rem 1rem 0rem;
    }
}
.form > div:first-of-type{
    display:grid;
    grid-template-columns: 50% 50%;
}

.form > div:nth-of-type(3){
    padding:1rem;
}

.form > div:first-of-type > div{
    padding:1rem;
}

.form > div:nth-of-type(2){
    padding: 0rem 1rem;
    max-width:500px;
}

@media (max-width:800px){
    .form > div:nth-of-type(2){
        max-width:none;
    }
}

@media (max-width:660px){
    .form > div:first-of-type{
        display:block;
    }
}

.form > div label{
    font-size:1.1rem;
    font-weight:500;
    display:block;
    margin-bottom:0.5rem;
}
.form > div input{
    /* padding:0.5rem 1rem; */
    padding:0.8rem 1.3rem;
    display:block;
    width:100%;
    margin:1rem auto;
    font-size:1.2rem;
    border:1px solid rgba(221, 151, 21, 0.6);
    transition:border-color 0.5s;
}
.form > div > textarea{
    padding:0.5rem 1rem;
    display:block;
    width:100%;
    min-height:8rem;
    border:1px solid rgba(221, 151, 21, 0.6);
    transition:border-color 0.5s;
}

.form > div > textarea, .form > div input{
    background-color:transparent;
}

.form > div > textarea:focus, .form > div input:focus{
    outline:none;
    border-color:rgb(221, 151, 21);
    background-color:white;
}

.required{
    color:red;
}

.form > input{
    display:block;
    padding:0.7rem 0.6rem;
    font-size:1.4rem;
    border:none;
    margin:2rem auto;
    width:max-content;
    color:white;
    background-color:rgb(72, 174, 72);
    min-width:150px;
    text-align:center;
    border-radius:5px;
    box-shadow: 2px 2px 20px rgb(120, 120, 120);
}

.form > input[type="submit"]:hover{
    background-color:rgb(67, 161, 67);
    cursor: pointer;
}

.successfullSubmit{
    border:1px solid black;
    padding:4rem 0rem;
    border:1px solid rgb(210, 210, 210);
    border-top:7px solid rgb(67, 161, 67);
    border-radius:5px;
    text-align:center;
    display:none;
}

@media (max-width:710px){
    .successfullSubmit{
        margin:0rem 1rem;
    }
}

.successfullSubmit h2{
    font-size:1.8rem;
    color:rgb(67, 161, 67);
}

.successfullSubmit h2, .successfullSubmit p{
    margin-bottom:2rem;
}

.successfullSubmit > button{
    padding:1rem 2rem;
    background-color:white;
    border:1px solid transparent;
    font-size:1.1rem;
    border-radius:5px;
    font-weight:500;
    box-shadow: 2px 2px 20px rgb(210, 210, 210);
    transition:border 0.5s;
}

.successfullSubmit > button:hover{
    cursor:pointer;
    /* background-color:rgb(252, 252, 252); */
    border:1px solid rgb(0, 115, 255);
}