﻿@charset "utf-8";
/* CSS Document */
/* PUBLIC RESPONSIVE CSS*/
/* 08/27/15 https*/
/* 02/15/16 h1*/
/* Donation page*/
/* 01/16/20 font awesome social icons*/

/*troubleshooting*/
/*
.col-md-3 {border:0px solid green;}
.col-sm-4 {border:0px solid blue;}
.col-xs-12  {border:0px solid red;}
.col-sm-12  {border:0px solid blue;}
.col-md-12  {border:0px solid red;}
p.test { border: 1px solid red; height: 30px; width: 200px; }
.rb { border: 2px solid red; }
.bb { border: 2px solid blue; }
#sizebar { width: 320px; height: 10px; background-color: red; display: none; }
*/


/*Footer*/
.container {max-width: 1000px;}
.mynavbar { background: #ff9306; padding: 60px 0px; margin-bottom: 0px; margin-top: 25px; }
.address { background: url(https://www.iCouldBe.org/standard/images/public/litm/map_pin.png) 0px 30px no-repeat; padding-left: 55px; }
.address p { font-size: 16px; line-height: 18px !important; }
.social p { color: #fff; margin: 30px 0 0 25px; }
.footerlink, .address, .social { margin-left: 0px; padding-top: 30px; }
.address { padding-bottom: 30px; }
.footerlink ul { list-style: none; }
.footerlink ul li a { color: #fff; font-size: 17px; line-height: 30px; }
.footerlink ul li a:hover { color: #fff; text-decoration: underline; }
.scrollToTop{width:200px; height:50px;margin: 10px auto 10px auto;text-align:center; color:#FFF;font-size:18px;text-transform:uppercase;font-weight:400;border:1px solid #FFF;background:none;padding:10px 30px;}
.scrollToTop:hover{text-decoration:none;border:1px solid #ff9306;color:#ff9306;background:#fff;}
.dcenter { width:215px;  margin-left: auto; margin-right: auto;}
.dcenterlink { width:130px;  margin-left: auto; margin-right: auto;}

/*font awesome social icon mods*/
.dcenter {width: 261px;}
.fab {font-size:40px; color:white; margin-left: 10px;}
.fab:hover {color:#EF7D22; cursor:pointer;}
/*.social a { float: left; width: 42px; height: 42px; background-image: url(https://www.iCouldBe.org/standard/images/public/litm/social_icn_linkin_fake.png); margin-left: 10px; }*/

/*Body*/
.maincontentdiv {width:auto !important; margin:0px !important;}
.maincontentdiv.inside {padding-left:5px!important;padding-right:5px!important;padding-top:0px!important;  }
.row .col-md-4 p { padding: 20px; font-size: 20px; font-weight: bold; text-align: center; background: #f2f2f2; }
.col-sm-4, .col-xs-12 { padding-right: 0; padding-left: 0; }
.push { height: 200px !important; }
.container.main {padding:0px 10px;}
    

/*General*/
img { max-width: 100%; height: auto; display: block; }
legend {border:0px;}
#header.logo img { max-width: none; height: initial}
.row { margin: 0px; }

/*Login form*/
#loginform{text-align:center}
h2.login {margin-bottom:7px;}

/*Centered link without arrow*/
div.noarrow_cont { text-align: center; }
a.noarrow {background:#ff9306;display: inline-block;color:#FFF;font-weight:normal;font-size:25px;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border:1px solid #ffd194;text-align:left;padding:10px 15px;width:auto;display: inline-block;}
a.noarrow:hover {background:#fff;border:1px solid #ff9306;color:#ff9306;}

/*Endless circles*/
.features {width:100%; }  
.featuresdiv { width: 30%; margin: 20px 1.6%;border: 0px solid orange; }

/*bottom scroll up icon*/
.scrollToTop {
    width: 80px;
    height: 30px;
    margin: 10px auto;
    text-align: center;
    color: #FFF;
    border: 1px solid #FFF;
    background: none;
    padding: 0px 10px;
    display: block;
}

/*left margin added to menu*/
.nav > li > a {margin-left: 10px;}

/*CSP donation page*/
#pub_donation p.don-csp-1 {margin:0px 0px 0px 10px;padding:5px;}
#pub_donation p.don-csp-2 {margin:0px 0px 0px 7px;padding:5px;}
#pub_donation p.don-csp-2 {margin: 8px;}
#pub_donation label {font-weight:normal!important}


@media (min-width: 1200px) {
    .social { margin-left:100px }
    .address {margin-left:50px  }
}

@media (min-width: 768px) and (max-width: 992px) {
    ul#menu li a { padding-right: 5px; padding-left: 10px; font-size: 18px; } /*was font-size: 14px; ipad*/
}

@media (min-width: 800px) {
    .nav { background: #fff; }
    .nav a { color: #ff9306; }
}

/*MIN! Tuts menu breakpoint is set in code at 800px */
@media (min-width: 800px) {
    ul.navbar ul { visibility: hidden; top: 100%; z-index: 598; list-style-type: none !important; width: 270px; position: absolute; left: 0; background-color: #2d67b2; color: #fff; font-size: 14px; text-transform: none; }
    ul.navbar li a { display: block; padding: 16px 14px; }
    ul.navbar ul a:hover { background: none; color: #FFF; text-decoration: none; background-color: #2d67b2; }
    ul.navbar a:link, ul.navbar a:visited { color: #FFF; text-decoration: none; font-size: 16px; font-weight: 100; }
    ul.navbar a:hover, ul.navbar a.active { color: #FFF; text-decoration: none; display: block; background: #2d67b2; }
    ul.navbar ul a:link { color: #FFF; width: 250px; background-image: none !important; z-index: 555; }
    ul.navbar { position: relative; z-index: 597; width: 100%; }
    ul.navbar li { float: left; vertical-align: middle; color: #000; line-height: normal; position: relative; padding: 0; }
}

/*Mid range - reduce font size on full menu*/
@media (min-width: 800px) and (max-width: 992px) {
    .logo {width: inherit; float: none; margin:0px;}
    .nav img { display: block !important }
}


@media (min-width: 768px) {
    .headerfight { width: auto; }
    #loginform { width: 500px; margin: 30px auto 30px auto; }
    .container { width: 100%; } /*bootstrap override of 750px*/

}

@media (max-width: 1200px) {
    .ul.dropdown li a { padding-right: 10px; padding-left: 15px; }
}

@media (max-width: 992px) {
    .push { height: 150px !important; }
    h2 { font-size: 22px; }
    h3 { font-size: 17px; }
    #loginform { margin-left: 10px; border: 0px solid gray; }

    /*top section*/
    .logosmaller {width:180px;}
    .logoconnect {width:15px !important; font-size:18px !important; margin-top:73px !important; margin-left:0px !important; margin-right:7px !important;}
    .greeting {width:auto !important;}
    .headerdash {float:none !important;}
    #header {float:none; width:96px; margin:auto !important;}    

    .nav img { display: none;} /*dots in the nav*/
    .headerfight{margin-top: -53px;} /*ipad menu*/
    .container { padding: 0px; } /* override bootstrap*/

}

@media (max-width: 800px) {
    #loginxs { float: right; margin-right: 20px; margin-top: 25px; }
    .logindivxs a { text-align: center; background: #2d67b2; border-radius: 3px; color: #FFF; font-size: 14px; font-weight: 400; padding: 7px 11px; }
}


@media (max-width: 768px) {
    .headerfight { width: auto; margin-top: 0px;}
    .nav img { display: none; }
    #login { margin-top: -35px; padding-right: 10px;}
    .midcenter {width:320px;margin:auto;} 
    .topnavbar { background: none;}    
    .orangecirc { width: 230px; }
    .featuresdiv { width: 230px; margin: 20px 0px;border: 0px solid orange; } /*margin:20px auto;*/
    .features { text-align: center; padding-left: 0px !important; } /*padding-left: 30px; */
    h3 { font-size: 20px; color: #2d67b2; letter-spacing: 0; font-weight: 500; text-align: center !important; margin: 20px 0; }
    h2 { font-size: 35px; color: #2d67b2; font-weight: 500; letter-spacing: 0; text-align: center !important; margin: 20px 0; }
    .features { width: 230px; margin: auto; border: 0px solid red;}
    .mynavbar { padding:10px 0px; } /*reduce space above the top link*/
}


@media (max-width: 480px) {
    .maincontentdiv.inside h1 { font-size: 28px; color: #000; letter-spacing: -2px; font-weight: 300; text-align: center !important; margin-top:10px !important; margin-bottom:10px !important;}  /*was margin: 80px 0 30px;*/
    .maincontentdiv.inside h2 { font-size: 24px; color: #2d67b2; font-weight: 500; letter-spacing: 0; text-align: center !important; margin: 20px 0; }
    .maincontentdiv.inside h3 { font-size: 17px; color: #2d67b2; letter-spacing: 0; font-weight: 500; text-align: center !important; margin: 20px 0; }
    .maincontentdiv.inside h4 { font-size: 15px; color: #2d67b2; letter-spacing: 0; font-weight: 500; text-align: center !important; margin: 20px 0; }
    .address { float: none; width: 200px; margin-left: auto; margin-right: auto; background-size:30px; background-position:15px 35px;}
    .social a { margin-left: 0px; }
    .maincontentdiv.inside div.notopmgn h3 { font-size: 20px; }
}

