/* Add here all your css styles (customizations) */

/* margin-top classes */
.margin-top-5  { margin-top:5px;}
.margin-top-10 { margin-top:10px;}
.margin-top-15 { margin-top:15px;}
.margin-top-20 { margin-top:20px;}
.margin-top-25 { margin-top:25px;}
.margin-top-30 { margin-top:30px;}
.margin-top-35 { margin-top:35px;}
.margin-top-40 { margin-top:40px;}
.margin-top-45 { margin-top:45px;}
.margin-top-50 { margin-top:50px;}
.margin-top-55 { margin-top:55px;}
.margin-top-60 { margin-top:60px;}
.margin-top-70 { margin-top:70px;}
.margin-top-80 { margin-top:80px;}
.margin-top-90 { margin-top:90px;}
.margin-top-100 { margin-top:100px;}

/* margin-left and margin-right column FIX classes */
.margin-left-right-fix  { margin-left: -30px; margin-right: -30px; }
.margin-left-right-fix-10  { margin-left: -10px; margin-right: -10px; }
.margin-left-right-fix-20  { margin-left: -20px; margin-right: -20px; }
.margin-left-right-fix-30  { margin-left: -30px; margin-right: -30px; }

/* Typography */
body {
    font-size: 14px !important;
}

.font-large {
    font-size: 1.3em;
}

.content img {
    max-width: 100%;
    height: auto;
}

/* Header Nav */

.header .topbar {
    transition: max-height .5s;
}

.header .navbar-nav > li > a {
    font-size: 14px; 
    color: #efefef;
}

.header .topbar ul.loginbar > li > a, 
.header .topbar ul.loginbar > li > a:hover {
    color: #dedede;
}

/* This will make the my.cvcc.edu top bar no underline CR */	
.topbar ul.loginbar  > li > a {
	text-decoration:none; }

body .header .nav > li > .search {
    color: #fff;
}

.header .logo {
    width: 190px;
}

@media (max-width: 1285px) {
    .header .navbar-nav > li > a {
        font-size: 13px; 
    }
}

/* Large Carousel */
.row-large-carousel {
    display: block;
    overflow: hidden;
    position: relative; 
}

    .row-large-carousel .slick-dots {
        display: block;
        overflow: hidden;
        margin: 10px 0;
        list-style: none;
        padding: 0;
        text-align: center;
    }

        .row-large-carousel .slick-dots li {
            padding: 0;
            margin: 0 5px;
            display: inline-block;
        }

            .row-large-carousel .slick-dots li button {
                background-color: rgba(238,237,222,1);
                border: 1px solid rgba(0,0,0,1);
                width: 30px;
            }

        .row-large-carousel .slick-dots li.slick-active button {
            background-color: rgba(255,255,255,0.99);
            color: #C41230;
        }

    .row-large-carousel .large-carousel-slide {
        width: 100%;
        position: relative; 
        display: block;
    }

        .row-large-carousel .large-carousel-slide img {
            width: 100%;
            height: auto;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link {
            position: absolute;
            top: 40px;
            left: 60px;
            max-width: 40%;
        }

            .row-large-carousel .large-carousel-slide .large-carousel-link span {
                display: inline-block;
                font-size: 1.8em;
                padding: 15px 20px;
            }

            .row-large-carousel .large-carousel-slide .large-carousel-link span.large-carousel-slide-header {
                background-color: rgba(255,255,255,.95);
                color: #333;
                margin-bottom: 10px;
                display: table;
            }

            .row-large-carousel .large-carousel-slide .large-carousel-link span.large-carousel-slide-button {
                background-color: #C41230;
                color: #fff;
                font-size: 1.25em;
                padding: 10px 15px;
            }

            .row-large-carousel .large-carousel-slide .large-carousel-link:hover {
                text-decoration: none;
            }

            .row-large-carousel .large-carousel-slide .large-carousel-link:hover span.large-carousel-slide-header {
                border-left: 3px solid #C41230;
                padding-left: 17px;
                background-color: #fff;
            } 

            .row-large-carousel .large-carousel-slide .large-carousel-link:hover span.large-carousel-slide-button {
                background-color: #A00F27;
            }

        .row-large-carousel .large-carousel-slide .large-carousel-link.right {
            left: auto;
            right: 60px;
            text-align: right;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link.bottom {
            top: auto; 
            bottom: 40px;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link.center-v {
            top: 30%;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link.center-h {
            left: 0;
            right: 0;
            text-align: center;
            margin: 0 auto;
        }


    .row-large-carousel .slick-arrow {
        position: absolute;
        z-index: 1000;
        top: 50%;
        /*line-height: 0;*/
        /*font-size: 0;*/
        background-color: rgba(255,255,255,.8);
        border: 1px solid #fff;
        color: #333;
        padding: 3px 5px;
        border-radius: 20px;
        width: 30px;
        height: 30px;
        box-shadow: 0 0 2px #999;
    }

        .row-large-carousel .slick-arrow.slick-prev {
            left: 20px;
        }

        .row-large-carousel .slick-arrow.slick-next {
            right: 20px;
        }

        .row-large-carousel .slick-arrow:before {
            line-height: .35;
            font-size: 35px;
            /*font-family: sans-serif;*/
        }

        .row-large-carousel .slick-arrow.slick-prev:before {
            /*content: '\2039';*/
        }

        .row-large-carousel .slick-arrow.slick-next:before {
            /*content: '\203A';*/
        }

.slick-dots {
    display: block;
    overflow: hidden;
    margin: 10px 0;
    list-style: none;
    padding: 0;
    text-align: center;
}

    .slick-dots li {
        padding: 0;
        margin: 0 5px;
        display: inline-block;
    }

        .slick-dots li button {
            background-color: rgba(255,255,255,0.99);
            border: 1px solid rgba(0,0,0,1);
            width: 30px;
			color: #000;
        }

    .slick-dots li.slick-active button {
        background-color: rgba(238,237,222,1);
        color: #C41230;
    }



/* News Carousel */
.news-v2 .news-v2-desc { margin:0; }

.news-carousel,
.video-carousel {
    position: relative;
    padding-bottom: 20px;
}

.news-slide a.read-more {
    color: #000;
    background-color:#ffffff;
	 font-weight: bold;
}


    .news-carousel .news-slide,
    .video-carousel .video-slide{
        padding: 15px;
    }

    .news-carousel .slick-arrow,
    .video-carousel .slick-arrow{
        position: absolute;
        bottom: 0;
        border: 1px solid #e7e7e7;
        background-color: #f7f7f7;
        /*border-radius: 30px;*/
        width: 30px;
        height: 30px;
    }

        .news-carousel .slick-arrow.slick-next,
        .video-carousel .slick-arrow.slick-next{
            right: 15px;
        }

        .news-carousel .slick-arrow.slick-prev,
        .video-carousel .slick-arrow.slick-prev{
            left: 15px;
        }

/* Content Box Links */
.content-boxes-v3 a.content-boxes-v3-link {
    display: block;
    overflow: hidden;
    width: 100%;
    background-color: #f7f7f7;
    padding: 5px 10px;
    margin: 10px 0;
    box-shadow: 0 1px 1px #e7e7e7;
}

    .content-boxes-v3 a.content-boxes-v3-link:hover {
        box-shadow: 0 0 2px #a7a7a7;
        text-decoration: none;
    }


a.content-boxes-v1-link {
    display: block;
    overflow: hidden;
    width: 100%;
    background-color: #f7f7f7;
    padding: 15px 10px;
    margin: 10px 0;
    box-shadow: 0 1px 1px #e7e7e7;
    text-align: center;
}

    a.content-boxes-v1-link:hover {
        box-shadow: 0 0 2px #a7a7a7;
        text-decoration: none;
    }

    a.content-boxes-v1-link span {
        display: block;
        margin-top: 5px;
    }

/* Take Action Floater Thingies */

.take-action-float {
    position: fixed;
    /*right: -5px;*/
    /*top: 105px;*/
    right: 0;
    top: 60%;
    z-index: 1000;

    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);

    transform-origin: top right;
}

    .take-action-float a {
        background-color: rgba(196,18,48, .9);
        color: white;
        text-align: center;
        padding: 10px;
        font-size: 1.2em;
        box-shadow: 0 0 1px #fff;
        display: inline-block;
        /*margin-bottom: 1em;*/
    }

    .take-action-float a:hover {
        background-color: #A00F27;
        text-decoration: none;
        color: white;
    }

    .take-action-float i {
        margin: 0 auto;
        font-size: 2.5em;
        display: block;
    }

    .take-action-float a:hover i {
        background-color: #A00F27;
    }

/*Footer*/
.footer-v1 .footer {
    padding-bottom: 15px;
}

.footer-v1 .footer, 
.footer-v1 .copyright {
    border-bottom: 1px solid #111; 
    border-top: 1px solid #333; 
}

.footer-map {
    margin-bottom: 10px;
}

.footer img {
    max-width: 100%;
    height: auto;
}

.footer a:hover {
    color: white;
}

.footer-link-list-first {
    text-align: right;
}

.footer-link-list-first li, 
.footer-link-list-second li {
    padding: 3px 0;
}

/* Header & Search Stuff */
.header .navbar-toggle.navbar-mobile-search-toggle {
    display: none;
}

.header .navbar-nav>li.mobile-only, 
.mobile-only {
    display: none;
}

.header .mobile-search {
    max-height: 0; 
    transition: max-height .5s;
    overflow: hidden; 
    background-color: #333;
}

    .header .mobile-search .container {
        display: table;
    }

    .header .mobile-search .form-control, 
    .header .mobile-search .input-group-btn {
        display: inline;
        vertical-align: inherit;
    }

    .header .desktop-only .input-group-btn {
        display: inline;
        vertical-align: inherit;
    }

.searchTextField {
    height: 34px;
    width: 241px;
}

/* Parallax with overlay */
.parallaxBG {
    background: url('/img/IMG_5587.jpg') fixed 50% 101px;
    width: 100%;
    height: auto;
    padding: 50px 0;
    position: relative;
    background-size: cover;
}

    .parallaxBG.has-overlay {
        padding: 0; 
    }

    .parallaxBG.has-overlay p {
        font-size: 1.15em;
    }

    .parallaxBG.has-overlay .parallax-overlay-red {
        background-color: rgba(196,18,48, .9); 
        width:100%;
        padding: 50px 0;
        text-shadow: 0 1px 0 #A00F27;
    }

    .parallaxBG.has-overlay .parallax-overlay-gray {
        background-color: rgba(0,0,0, .8); 
        width:100%;
        padding: 50px 0;
    }

/*Number Buttons*/
a.number-button {
    display: block;
    overflow: hidden;
    text-align: center; 
    padding: 15px;
    background-color: #e7e7e7;
    color: #333;
    margin: 10px 0;
}

    a.number-button .number-box {
        padding: 15px 25px;
        margin: 15px 0;
        text-align: center;
        font-size: 2em;
        border: 1px solid #333;
        display: inline-block;
    }

img.gap-right {
    margin-right: 10px;
}

img.gap-left {
    margin-left: 10px;
}

/* List Group */
ul.list-group {
    padding: 0;
    margin: 10px 0;
    list-style: none;
}
    ul.list-group li {
        padding: 10px 10px;
        border-bottom: 1px solid #e7e7e7;
    }

ul.list-group.sidebar-nav-v1 {
    margin-top: 0;   
}
    ul.list-group.sidebar-nav-v1 li {
        padding: 0;
    }


/*Large number feature*/
.large-number-feature {
    margin: 0 0 15px 0;
    display: block;
    overflow: hidden;
    padding: 5px;
}

.large-number-feature:hover,
.large-number-feature:focus {
    text-decoration: none;
    background-color: rgba(0,0,0,.1);
}

.large-number-feature:hover .heading,
.large-number-feature:focus .heading {
    text-decoration: underline;
}

    .large-number-feature .large-number {
        display: block; 
        font-size: 1.8em;
    }

/* Directory photo filler icon  */
.portrait-filler {
    float: left;
    padding: 10px;
    font-size: 4.5em;
    margin: 0 10px 10px 0;
    border: 1px solid #777;
}

/* Give wide containers negative margin so they can be inside a fluid parent container */
.bg-color-red,
.bg-color-light,
.bg-color-white {
    margin-left: -15px;
    margin-right: -15px;
}

@media (max-width: 991px) {
    body.header-fixed-space-default {
        margin-top: 81px;
    }

    .header-fixed .header.header-sticky, .header-fixed .header.header-fixed-shrink {
        position: fixed;
    }

    .header-fixed .header.header-fixed-shrink .logo img {
        height: 35px;
    }

    .header .navbar-toggle.navbar-mobile-search-toggle, 
    .header .navbar-toggle.navbar-mobile-search-toggle:hover {
        display: block;
        float: right;
        /*padding: 3px 5px;*/
        /*background-color: #A00F27;*/
        /*color: white;*/
    }

    .header .navbar-nav>li.mobile-only, 
    .mobile-only {
        display: block;
    }

    .header .navbar-nav>li.desktop-only, 
    .desktop-only {
        display: none;
    }

    .header .mobile-search.active {
        max-height: 60px;
        border-top: 1px solid #555;
        border-bottom: 1px solid #555;
        padding: 10px 0;
    }

    .header .navbar-toggle {
        margin-top: 25px;
    }

        .header-fixed .header.header-fixed-shrink .navbar-toggle {
            margin-top: 10px;
        }

    /* Large Carousel*/
    .row-large-carousel .large-carousel-slide .large-carousel-link {
        top: 20px;
        font-size: .9em;
    }

        .row-large-carousel .large-carousel-slide .large-carousel-link.bottom {
            bottom: 20px;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link span {
            padding: 10px 15px;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link span.large-carousel-slide-button {
            padding: 8px 10px;
        }

    /* homepage content box buttons */
    .col-md-3.col-xs-6.content-box-col:nth-child(3n) {
        clear: left;
    }

    /* Footer */
    .footer-link-list-first, 
    .footer-link-list-second {
        text-align: center;
    }

    .footer-link-list-second {
        margin-bottom: 20px;
    }
}

@media (max-width: 850px) { 
    /* Large Carousel*/
    .row-large-carousel .large-carousel-slide .large-carousel-link {
        font-size: .7em;
        top: 10px;
    }

        .row-large-carousel .large-carousel-slide .large-carousel-link.bottom {
            bottom: 10px;
        }
}

@media (max-width: 650px) { 
    body.header-fixed-space-default {
        margin-top: 72px;
    }

    .header .navbar-toggle {
        margin-top: 20px;
    }

    .header .logo img {
        height: 50px;
    }

    

    .header.loginbar-active {
        padding-top: 30px;
    }

    .header .topbar {
        max-height: 0;
        overflow: hidden; 
        padding: 0;
        float: none;
        width: 100%;
        position: absolute;
        left:0;
        top:0;
    }

    .header .navbar-toggle.navbar-mobile-search-toggle {
        display: block;
    }

    .header.loginbar-active .topbar {
        max-height: 50px;

    }

    .header .topbar ul.loginbar {
        display: table;
        width: 100%;
        padding: 6px 0 4px;
        border-bottom: 1px solid #555;
        background-color: #333;
    }

        .header .topbar ul.loginbar > li {
            display: table-cell;
            text-align: center;
            vertical-align: middle;
            padding: 0;
        }

        .header .topbar ul.loginbar > li.topbar-devider {
            display: none;
        }

            .header .topbar ul.loginbar > li a {
                width: 100%;
                padding: 3px;
                display: block;
                text-decoration: underline;
            }

    .take-action-float {
        top: auto;
        bottom: 0;
        right: auto;
        width: 100%;
        background-color: rgba(196,18,48, .9);
        box-shadow: 0 -1px 0 #A00F27;
        display: table !important;

        -webkit-transform: none;
        -moz-transform: none;
        -o-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .take-action-float a {
        font-size: 1.25em;
        display: table-cell;
        margin: 0;
        background-color: transparent;
        box-shadow: none;
        border-right: 1px solid #A00F27;
    }

        .take-action-float a i {
            display: inline-block;
            font-size: 1.25em;
            position: relative;
            top: 6px;
        }

    /* Large Carousel*/
    .row-large-carousel .large-carousel-slide .large-carousel-link {
        display: block;
        position: relative;
        width: 100%;
        max-width: 100%;
        left: 0;
        top: 0;
        bottom: auto;
        right: auto;
        padding: 15px;
        background-color: #efefef;
        overflow: hidden;
        text-align: center
    }

        .row-large-carousel .large-carousel-slide .large-carousel-link.bottom {
            bottom: 10px;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link span.large-carousel-slide-header,
        .row-large-carousel .large-carousel-slide .large-carousel-link span.large-carousel-slide-button  {
            display: inline-block;
            font-size: 1.25em;
            padding: 10px 15px;
            margin: 0;
        }

        .row-large-carousel .large-carousel-slide .large-carousel-link:hover span.large-carousel-slide-header {
            padding-left: 12px;
        }


}

@media (max-width: 480px) {
    .header.loginbar-active {
        padding-top: 50px;
    }

    
}

@media (max-width: 450px) {

    
}

.left-nav {
    display: block;
    padding: 10px 15px;
    background-color: #444;
    font-size: 1.2em;
}

.left-nav a {
    color: white;
}

/* homepage red aside */
.aside-red h2 {
  border-bottom: 1px solid #A00F27; 
  padding-bottom:5px;
}

/* content heading fixes */
/* .schoolprogramname, .pagetitle {
  display: none;
}*/

/* Makes CommonSpot container element icons compatible with Bootstrap */
.container-fluid > .cs_elementUI {
    margin-left: -15px;
}

.container-fluid > .cs_cinfobar {
    margin-left: -15px;
}

/*General Additions CR */

.AnouncementInformation{font-family: "Arial", Helvetica, sans-serif; font-size:16px; line-height:1; color:#C41230;}
.categorytitle{font-family: "Arial", Helvetica, sans-serif; font-size:14px; font-weight:bold;}

h1 {font-size: 2em;  
font-weight: bold;  color: #000;
Font-family: "Arial", Helvetica, sans-serif;
}

h2 { 
font-size: 1.5em;
font-weight:bold; 
Font-family: "Arial", Helvetica, sans-serif;
  }
h3 { 
font-size: 1.17em;
font-weight:bold;
Font-family: "Arial", Helvetica, sans-serif;
 }
h4 {
font-size: 1em;  
font-weight:bold;
Font-family: "Arial", Helvetica, sans-serif; 
}
h5 { 
font-size: .83em;
font-weight:bold;
Font-family: "Arial", Helvetica, sans-serif; 
}
h6 {
font-size: .67em; 
font-weight:bold;
Font-family: "Arial", Helvetica, sans-serif; 
}

.table { border-collapse: separate; border-spacing: 2px; border-color:#e3e3e3;
 }
.table tr td { Padding:2px; }

.redboldcontent{font-weight:bold; color:#C41230;}
.boldcontent{font-weight:bold;}
.btmdot {BORDER-BOTTOM: #999 1px dotted;}
.topdot {BORDER-TOP: #999 1px dotted;}
.redtext{font-weight:bold; color:#C41230;}
.LargeText{font-weight:bold; font-size: 1em; Font-family: "Arial", Helvetica, sans-serif;}
.ListNoBullet{list-style: none;}

ul.Check {
list-style-image: url('/images/CheckSmall.jpg');
}

.th {
    padding: 2px; border-color:#e3e3e3;
}

}

.td {
    padding: 2px; border-color:#e3e3e3;
}


.li a { color: #C41230; }


#skipcontent a
{ 
position:absolute; 
left:-10000px; 
top:auto; 
width:1px; 
height:1px; 
overflow:hidden;
} 
 
#skipcontent a:focus 
{ 
position:static; 
width:auto; 
height:auto; 
} 

@media print {
    body {
        background-color: inherit;
        background-image: none;
        color: #000000
    }

    #ad {
        display: none;
    }

    #leftbar {
        display: none;
    }

    #leftNav {
        display: none;
    }

    #contentarea {
        width: 100%;
    }

    .header {
        display: none;
    }

    .topbar {
        display: none;
    }

    .left-nav {
        display: none;
    }

    .take-action-float {
        display: none;
    }

    .header-fixed .header-fixed-space-default {
        display: none;
    }

    .list-group.sidebar-nav-v1 {
        display: none;
    }

    .footer-link-list-first {
        display: none;
    }

    .footer-link-list-second {
        display: none;
    }

    .footer-v1 {
        display: none;
    }

    .footer {
        display: none;
    }

    .input-group-btn {
        vertical-align: bottom;
    }

    .CS_LinkBar_Item {
        visibility: hidden;
    }

    .CS_LinkBar_Separator {
        visibility: hidden;
    }

    .header .header-sticky {
        display: none;
    }

    .cs_control .take-action-float {
        vertical-align: bottom;
    }

    .bg-color-red {
        color: transparent;
    }

    .background-color {
        display: none;
    }

    .background-color-light {
        display: none;
    }

    #cs_control_7317 {
        visibility: hidden;
    }




/* SKIP CR */

.skiplink a
{ 
position:absolute; 
left:-10000px; 
top:auto; 
width:1px; 
height:1px;
text-align: left;  
overflow:hidden;
} 
 
.skiplink a:focus a:active
{ 
position:static; 
width:auto; 
height:auto;
overflow:visible;
background-color:#FF3;
border: 1px dotted #000;
} 


/* End SKIP CR */


/* Progress bar - Make sure that padding behaves as expected */
 

* {box-sizing:border-box}

/* Container for skill bars */
.container2 {
    width: 100%; /* Full width */
    background-color: #ddd; /* Grey background */
}

.skills {
    text-align: right; /* Right-align text */
    padding-right: 20px; /* Add some right padding */
    line-height: 15px; /* Set the line-height to center the text inside the skill bar, and to expand the height of the container */
    color: white; /* White text color */
}


.css {width: 15%; background-color: #c41230;} /* Red */
.css1 {width: 30%; background-color: #c41230;} /* Red */
.css2 {width: 45%; background-color: #c41230;} /* Red */
.css3 {width: 60%; background-color: #c41230;} /* Red */
.css4 {width: 75%; background-color: #c41230;} /* Red */
.css5 {width: 90%; background-color: #c41230;} /* Red */
.css6 {width: 100%; background-color: #c41230;} /* Red */
}

 /* end progress bar*/


/* 3 columns that stacks for media CR */

 
* {
    box-sizing: border-box;
}
.row::after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    float: left;
    padding: 12px;
}
html {
    font-family: "arial", sans-serif;
 
    
}
/* For desktop: */
.col-1 {width: 33%;}
.col-2 {width: 33%;}
.col-3 {width: 33%;}
 
.col-12 {width: 100%;}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }
}
 
/* end 3 columns*/


/* Tables*/

.tabletags body
{
	border-color:#e3e3e3;
	vertical-align:Top;
	align:Left;
	 
  
}
.tableytags	th
{
	border-color:#e3e3e3;
	vertical-align:Top;
	align:Left;
	 
  
}
	
.tabletags	td
{
	border-color:#e3e3e3;
	vertical-align:Top;
	align:Left;
	 
  
}

/* End Tables*/

.tablelt {font-size:12px;color:#000000;width:100%;border-width: 1px;border-color: #e3e3e3 boarder-collapse: collapse;}
.tablelt th {font-size:12px;background-color:#ffffff;border-width: 1px;padding: 4px;border-style: solid;border-color: #e3e3e3;text-align:left;}
.tablelt tr {background-color:#000000;}
.tablelt td {font-size:12px;border-width: 1px;padding: 4px;border-style: solid;border-color: #e3e3e3;}
.tablelt tr:hover {background-color:#e3e3e3;}