@font-face {
    font-family: Play-Regular_font;
    src: url('Play-Regular.eot');
    src: local(Play-Regular_font), url('fonts/Play/Play-Regular.ttf') format('opentype');
}

@font-face {
    font-family: Play-Bold_font;
    src: url('Play-Bold.eot');
    src: local(Play-Bold_font), url('fonts/Play/Play-Bold.ttf') format('opentype');
}

body {
    /*background: url(../img/bg.jpg) no-repeat top left;*/
    background: url(../img/bg.webp) no-repeat top left;
    margin:0;
    font-size: 0.9em;
    font-family: arial, helvetica, sans-serif;
    line-height: 1.5em;
}
a{color:#ff0000;}
#content {
    margin: 0;
    padding: 0;
    height: 486px;
}
#wrapper {
    width: 1280px;
    margin: 0 auto;
}
#logo {
    float: left;
    width: 312px;
    margin-top: 30px;
    margin-left: 30px;
    position: absolute;
}

#type_logo {
    top: 50px;
}

p.blurb_about {
    text-align: justify;
}

#right {
margin-top: 50px;
width:65%;
float:right;

}

.red {
    color: red;
}

#subtitle_left {
    margin-left: 40px;
    margin-top: 30px;
    height: 40px;
    background: url(img/subtitle_left.png) no-repeat;
    text-indent: -3000px;
}

#footer {clear:both; position: relative; width:1380px; height:150px; margin:0 auto; padding-bottom: 50px;}
#footer li {display:inline;}
.play {font-family: Play-Regular_font;}
.play_bold {font-family: Play-Bold_font;}
.contact_column_left {float:left; display:block; width:200px; margin-left:50px;}
.contact_column_middle {float:left;}
.contact_column_right {float:right;}
#form {width: 740px; margin-left:auto; margin-right:auto;}
#ContactHeader {font-family: Play-Regular_font; font-size: 2em; line-height: 1.8em;}
#ContactName {width: 150px;}
#ContactFrom {width: 150px;}
#ContactSubject {width: 150px;}
#ContactMessage {width: 350px;}
#middleBanner {text-align:center;}

#website{
    display:none;   
}


#div_sent{
    color: green;
    font-size: large;
    text-align: center;
    margin-bottom: 50px;
    margin-top: 50px;
}
#div_error{
    color: red;
    font-size: large;
    text-align: center;
    margin-bottom: 50px;
    margin-top: 50px;
}

h1, h2{
    line-height: 1.2em;
    font-size: 1.5em;
}

#contact_title{
    font-size:2.4em; 
    font-weight:bold; 
    padding-top:17px;
}

/*
@media screen and (max-width: 1435px) and (min-width: 1150px){
    
}
@media screen and (max-width:1150px) and (min-width:900px){

}
@media screen and (max-width:900px) and (min-width:851px){
    
}
@media screen and (max-width:851px) and (min-width:650px){
    
}
@media screen and (max-width:650px) and (min-width:0px){
    
}
*/

@media screen and (max-width:1290px) and (min-width:500px){
    #logo img{
        width: 100%;
    }
    #logo{
        width: calc(25% - 60px);
    }
    #logo_type img{
        width:95%;
    }
    #right {
        margin-top: 50px;
        width: calc(75% - 30px);
        float: left;
        margin-left: 25%;
    }
    #wrapper{
        width:100%;
    }
    
    h1, h2{  
        line-height: 1.0em;
        font-size: 1.2em;
    }
    p.blurb_about{
        width: 100%;
    }
    #middleBanner img{
        width:100%;
        height: unset;
    }
    #form{
        width:100%;
    }
    #ContactAddress{
        width:100%;
    }
    .contact_column_left{
        text-align: center;
        margin-left: unset;
        width: 100%;
    }
    
    body{
        background-size: 100%;
    }
}



@media screen and (max-width:500px) and (min-width:0px){
    #logo img{
        width: 100%;
    }
    #logo{
        width: calc(25% - 60px);
    }
    #logo_type img{
        width:95%;
    }
    #right {
        margin-top: 50px;
        width: calc(75% - 30px);
        float: left;
        margin-left: 25%;
    }
    #wrapper{
        width:100%;
    }
    
    h1, h2{  
        line-height: 1.0em;
        font-size: 1.2em;
    }
    p.blurb_about{
        width: 100%;
    }
    #middleBanner img{
        width:100%;
        height: unset;
    }
    #form{
        width:100%;
    }
    #ContactAddress{
        width:100%;
    }
    .contact_column_left{
        text-align: center;
        margin-left: unset;
        width: 100%;
    }
    body{
        background-size: 100%;
    }
}