/* CSS Document */
* {
    font-family:  'Source Sans 3', Arial,  Helvetica, sans-serif;
    font-size: 11px;
}
html {
    background-color: #595959;
    background-image: url(Images/out_background.jpg);
    background-size: 100% 300%;
    width: 100%;
}


.site_external_6 {
    background-image: url(Images/TBC.jpg);
}

.site_external_34 {
    background-image: url(Images/FB.jpg);
}

@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */
    html {
        background-size: 100% 300%;
    }
}

@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
    html {
        background-size: 100% 300%;
    }
}

@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
    html {
        background-size: 100% 300%;
    }
}

@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */
    html {
        background-size: 100% 300%;
    }
}

@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */
    html {
        background-size: 100% 275%;
    }
}

@media (min-width:1281px) { /* hi-res laptops and desktops */
    html {
        background-size: cover;
    }
}


body {
    margin: 0px;
    width: 100%;
}



table.login {
    background-color: none; /*#7DBA31;*/
    text-align: center;
}
div#fullPage {
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 10px;
}
#c_logo {
    bottom: 0px;
    position: absolute;
    
    text-align:center;
    z-index: -10; 
    width: 100%;
}

    #c_logo > img {
        height: 38px;
        background-color: rgba(0,0,0,1);
       /* background: linear-gradient(rgba(255,255,255,0.80), rgba(255,255,255,1));
        padding: 8px 30px 0px 30px;
        box-shadow: 0px -2px 2px #111;*/
        border-radius: 4px 4px 0 0;
        /*border: 1px solid #000;*/
    }

div#content {
    width: 800px;
    height: 100%;
    background-color: rgba(255,255,255,0.8);
    border: 1px black solid;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    border-radius: 10px;
    box-shadow: 5px 5px 6px #222;
}
#banner {
    background-color: rgba(255,255,255,.0);
    /*border-bottom: 1px solid rgba(255,255,255,.0);*/
    background-image: linear-gradient(to bottom, rgba(255,255,255,.7), rgba(255,255,255,.6), rgba(255,255,255,.3), rgba(255,255,255,.0));
}
    #banner > img {
        border-radius: 10px 10px 0 0;
        margin-top: -10px;
        padding-bottom: 10px;
    }
div#bodyContent {
    margin-top: 30px;
}
#bodyContent > form > table {
    margin-top:40px; 
    border-radius:10px;
    text-align: center;
}
#login_table {
    background-color:rgba(255,255,255,.9); 
    border-radius:5px; 
    border: none; 
    /*box-shadow: 2px 2px 5px #222;*/
    margin:20px auto;
    padding:20px;
}

div#host {
    text-align: left;
    font-family: 'Source Sans 3', Arial,  Helvetica, sans-serif;
    font-size: 9px;
    color: #FFFFFF;
    bottom: 0;
    position: absolute;
    width: inherit;
    z-index: -50;
    font-variant: all-petite-caps;
}

.system_warning{
    text-transform:uppercase;
}

#host > #hosttext {
    padding: 5px 0px 3px 20px;
} 

div#copyright {
    text-align: right;
    font-family:  'Source Sans 3', Arial,  Helvetica, sans-serif;
    font-size: 9px;
    color: #FFFFFF;
    background: #000000;
    bottom: 0;
    position: absolute;
    width: inherit;
    z-index:-100;
}
#copyright > #text {
    padding: 5px 20px 3px 0;
    font-family: Arial;
    font-variant: all-petite-caps;
} 

#copyright>div>a{
    color:#ddd;
    text-decoration:none;
}
div#titleBlock	{
	font-family:'Source Sans 3', Arial,  Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
	background:#000000;
	padding: 2px 2px 2px 6px;
	padding-bottom:14px;
}
td#aboutPetrointernet	{
	font-size:12px;
	letter-spacing:0.02em;
	line-height:1.5em;
	vertical-align:top;
	padding:4px 4px 4px 8px;
	text-align:left;
}
td#login	{
	vertical-align:top;
}
td#sideBar	{
	vertical-align:top;
	text-align:left;
}
td#moreInfoForm	{
	font-family: 'Source Sans 3', Arial,  Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
}
p#title	{
	font-size:16px;
	font-weight:bold;
	letter-spacing:-0.02em;
	color:#003300;
	margin-top: 5px;
	margin-bottom:3px;
	padding:0px;
}

p#firstTitle	{
	font-size:16px;
	font-weight:bold;
	letter-spacing:-0.02em;
	color:#003300;
	margin-top: 175px;
	margin-bottom:3px;
	padding:0px;
}
p#footnote	{
	font-family:'Source Sans 3', Arial,  Helvetica, sans-serif;
	font-size:9px;
	text-align:left;
}
p	{
	font-size:12px;
	font-weight:normal;
	letter-spacing:-0.02em;
	color:#000000;
	margin-top:4px;
	margin-bottom:12px;
	margin-right:8px;
}
ul {
	font-family: 'Source Sans 3', Arial,  Helvetica, sans-serif;
	font-size: 10px;
	line-height: 2em;
	font-weight: bold;
	color: #666666;
	list-style-position: outside;
	list-style-type: square;
	margin: 0px;
	padding-top: 8px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 16px;
}
input {
    font-family:  'Source Sans 3', Arial,  Helvetica, sans-serif;
    font-size: 11px;
    padding: 5px;
    border-radius: 3px;
    border: 1px #ccc solid;
}

.login_button {
    width: 100%;
    padding: 15px;
    border-style: dotted;
    cursor: pointer;
    color: #444;
}


    .login_button:hover {
        background-color: #dedede;
        color: #000;
    }


    .login_button:active {
        background-color: #dedede;
        color: #555;
    }
    
.login_help, .login_help:visited {
    color: #444;
}

    .login_help:hover {
        color: #bbb;
    }