#div_php_contact_form{background-color: #BE705C; color: white; font-size: 1.5em; top: 25px;}

#formulario_contact_form{position: relative; margin: auto;}

.contact-title{font-family: 'TradeGothicLTStd-Bd2'; border-bottom: 3px solid white; padding: 25px 0px 15px 0px;
               text-align: center; height: auto; position: relative; margin-bottom: 25px;}
.contact-descript{color: white; position: relative; text-align: center; margin-bottom: 25px;}

#main-content{margin-bottom: 150px;}

.formulario {margin-top: 10px; margin-bottom: 10px;}

.form-column-left p{float: right; width: 65%; padding-top: 10px;}
.form-column-left i{float: right; width: 10%; padding-top: 10px;}

.form-control{border: 1px solid #74020d; border-radius: 5px;}

.send-button{background-color: white; color: #74020d; border-radius: 5px; border: 1px solid #eceded; padding: 5px 25px 5px 25px;
             font-size: 14pt; float: left; width: 125px;}
#icono-loading{float: left; padding-left: 25px;}

/*.alert-success {color: #74020d; background-color: #d2ebd7; border-color: #74020d; font-family: "TradeGothicLTStd";
                margin-top: 25px; position: relative; width: 60%; left: 20%;}
.alert-danger {color: white; background-color: #fa5858; border-color: red; font-family: "TradeGothicLTStd-Bd2";
               margin-top: 25px; position: relative; width: 60%; left: 20%;}*/

#submit:hover{background-color: #ddd; color: black; border: 1px solid black;}
a:hover{color: #ddd; text-decoration: underline;}

.checkbox{margin-top: 10px; margin-bottom: 30px;}
#checkbox{padding-top: 0px; width: 25px; height: 25px;}
#label_checkbox{font-size: 1.25em;}
#span_checkbox{margin-left: 17px; position: relative; top: 3px;}

@media only screen and (min-width: 1680px) {

    #main-content{position: relative; width: 100%}

    #formulario_contact_form{width: 1200px;}
    
    .contact-title{width: 50%; left: 25%;font-size: 16pt;}
    .contact-descript{width: 50%; left: 25%; font-size: 12pt;}

    .form-control{width: 75%;}
    .form-column-left p {font-size: 11pt;}

}


@media only screen and (min-width: 1367px) and (max-width: 1679px){

    #main-content{position: relative; width: 100%;}
    
    #formulario_contact_form{width: 1200px;}

    .contact-title{width: 50%; left: 25%; font-size: 16pt;}
    .contact-descript{width: 70%; left: 15%; font-size: 12pt;}   

    .form-control{width: 75%;}
    .form-column-left p {font-size: 11pt;}
}


@media only screen and (max-width: 1367px) and (min-width: 1201px){

    #main-content{position: relative; width: 100%;}

    .contact-title{width: 50%; left: 25%; font-size: 16pt;}
    .contact-descript{width: 80%; left: 10%; font-size: 12pt;}   

    .form-control{width: 85%;}

    .form-column-left p {font-size: 11pt;}

}


@media only screen and (max-width: 1200px) and (min-width: 994px){

    #main-content{position: relative; width: 90%; left: 5%;}
    .contact-title{width: 50%; left: 25%; font-size: 14pt;}
    .contact-descript{width: 90%; left: 5%; font-size: 11pt;}   
    .form-control{width: 85%;}

    .form-column-left p {font-size: 11pt;}

}

@media only screen and (max-width: 993px) and (min-width: 768px) {


    #main-content{position: relative; width: 100%; left: 0%;}

    .contact-title{width: 50%; left: 25%; font-size: 14pt;}
    .contact-descript{width: 90%; left: 5%; font-size: 11pt;}  
    .form-control{width: 95%;}

    .form-column-left p {font-size: 9pt;}

}

@media only screen and (min-width: 678px) and (max-width: 767px) {

    #main-content{position: relative; width: 90%; left: 5%;}

    .contact-title{width: 70%; left: 15%; font-size: 14pt; margin-top: 10px;}
    .contact-descript{width: 90%; left: 5%; font-size: 10pt;}  
    .form-control{width: 95%;}

    .form-column-left p {font-size: 9pt;}

}

@media only screen and (min-width: 581px) and (max-width: 677px) {                

    #main-content{position: relative; width: 90%; left: 5%;}

    .contact-title{width: 70%; left: 15%; font-size: 14pt; margin-top: 10px;}
    .contact-descript{width: 90%; left: 5%; font-size: 10pt;} 
    .form-control{width: 95%;}
    .form-column-left p {font-size: 9pt;}

}

@media only screen and (min-width: 481px) and (max-width: 580px) {                

    #main-content{position: relative;  width: 90%; left: 5%;}

    .contact-title{width: 70%; left: 15%; font-size: 13pt; margin-top: 10px;}
    .contact-descript{width: 90%; left: 5%; font-size: 9pt;} 
    .form-control{width: 95%;}
    .form-column-left p {font-size: 8pt;}

}

@media only screen and (max-width: 480px){


    #main-content{position: relative; width: 95%; left: 2.5%;}

    .contact-title{width: 70%; left: 15%; font-size: 13pt; margin-top: 10px;}
    .contact-descript{width: 95%; left: 2.5%; font-size: 9pt;} 
    .form-control{width: 100%;}
    .form-column-left p {font-size: 8pt;}

}

@media (min-height: 841px) {
    footer{position: fixed; left: 0; bottom: 0; height: 150px; width: 100%; overflow: hidden;}
}
