@charset "UTF-8";

/***************************************************************************************/
/*** reset                                                                           ***/
/***************************************************************************************/
html, body, div, section, article, aside, header, hgroup, footer, nav, h1, h2, h3, h4, h5, h6, p, blockquote, address, time, span, em, strong, img, ol, ul, li, figure, canvas, video, th, td, tr {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align:baseline;
	font: inherit;
}

/*html5 display rule*/
address, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section, summary {
	display: block;
}

/***************************************************************************************/
/*** global styles                                                                   ***/
/***************************************************************************************/

html {
	background: #1c60b3;
}

body {
    width: 1068px;
    position: relative;
    background: #1c60b3;
    margin: 0 auto;
    font: 100% Cantarell, Arial, Cantarell, Helvetica, sans-serif;
    margin-top: 90px;
}

header{
    height: 74px;
    position: fixed;
    top: 0;
    left: 10px;
    right: 10px;

    z-index: 9000;
    padding: 1px 10px 10px 10px;
    background-color: #fff;
    border-radius: 0 0 5px 5px;
    -webkit-box-shadow: 0px 15px 32px -15px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 15px 32px -15px rgba(0,0,0,0.75);
    box-shadow: 0px 15px 32px -15px rgba(0,0,0,0.75);
    margin: 0 auto;

}

.grad {
    background: #1c60b3 !important; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#1c60b3, #ffffff) !important; /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#1c60b3, #ffffff) !important; /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#1c60b3, #ffffff) !important; /* For Firefox 3.6 to 15 */
    background: linear-gradient(#1c60b3, #ffffff) !important; /* Standard syntax */
}

.grad-white {
    background: #1c60b3 !important; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#fff, #ccc) !important; /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#fff, #ccc) !important; /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#fff, #ccc) !important; /* For Firefox 3.6 to 15 */
    background: linear-gradient(#fff, #ccc) !important; /* Standard syntax */
}

.logo {
    width: 300px;
}

#header-left{
    float: left;
    background-color: #fff;
    padding-left: 10px;
}

#header-right{
    float: right;
    background-color: #fff;
    padding: 10px 0 0 0;
    font-style: italic;
    color: #657b96;
}

#header-right img{
    width: 196px;
    height: 49px;
}

footer{
    height: 25px;
    background-color: #1c60b3;
    color: #fff;
    clear: both;
    line-height: 1em;
}

footer p{
    padding: 5px 0 0 0;
    font-size: .75em;
    text-align: center;
    color: #fff;
}

footer a{
    font-size: 1em;
    color: #fff;
}

h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 2em;
    color: #343434;
}

h2 {
    font-family: 'Oswald', sans-serif;
    font-size: 1.2em;
    color: #657b96;
}

input[type=button], input[type=submit] {
    border: none;
    padding: 8px 8px;
    margin: 0;
    background: #3a87c1;
    border-radius: 5px;
    float: right;
    margin: 0 0 0 7px;
    color: #fff;
    font-size: 16px;
    font-weight: normal;
    -webkit-appearance:none;
}

/***************************************************************************************/
/*** media styles                                                                    ***/
/***************************************************************************************/

/*
@media screen and (max-width:320px) {
}

@media screen and (min-width:321px) and (max-width:480px) {
}

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

}
@media screen and (min-width:769px) {

}
*/

/****************************************************************/
/****************************************************************/
@media only screen and (min-width:768px) and (max-width:1068px) {

    body {
        width: 748px;
    }

}

/****************************************************************/
/****************************************************************/
@media only screen and (max-width:767px) {

    body {
        width: 320px;
    }

    header{
        height: 54px;
        padding: 1px 10px 0px 10px;
    }

    #header-right{
        padding: 3px 0 0 0;
    }

    #header-left h1{
        font-size: 1.2em;
    }

    #header-left h2{
        font-size: .7em;
    }

    #header-right img{
        width: 100px;
        height: auto;
    }

    #header-right p{
        display: none;
    }

    footer{
        height: 35px;
        background-color: #1c60b3;
        clear: both;
    }

    footer p{
        font-size: .65em;
        padding: 3px;
    }

}