@font-face {
    font-family: "My Custom Font";
    src: url(../fonts/myfont.ttf) format("truetype");
}
body
{
    overflow-x: hidden;
    font-family: "My Custom Font", Verdana, Tahoma;
}
nav
{
    opacity: 0.7;
    -webkit-animation: examplee 0.8s ;
    animation: examplee 0.8s ;
    animation-fill-mode: forwards;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes examplee {
    from {opacity: 1}
    to {opacity: 0.7}
}

/* Standard syntax */
@keyframes examplee {
    from {opacity: 1}
    to {opacity: 0.7}
}
nav:hover
{
    -webkit-animation: example 0.8s ;
    animation: example 0.8s ;
    animation-fill-mode: forwards;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    from {opacity: 0.7}
    to {opacity: 1}
}

/* Standard syntax */
@keyframes example {
    from {opacity: 0.7}
    to {opacity: 1}
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
    color: #555; 
    background-color: #ffffff;
}
#bs-example-navbar-collapse-1
{
    background-color: #ffffff;
}
a
{
    border-radius: 15px;/*****************************************************************************************************/
}
#bs-example-navbar-collapse-1 .active img
{
    max-height: 48px;
}
.logo
{
    margin: 20px 10px 10px 40px;
}
.pargl
{
    margin: 20px 10px 20px 40px;
    padding: 20px;
    font-size: 20px;
    background-color: rgba(167, 169, 171, 0.09);
    border-radius: 30px;
    color: #58585B;
    letter-spacing: 1.2px;
    line-height: 150%;
    height: 250px;
}
.pargr
{
    margin: 20px 40px 20px 10px;
    padding: 20px;
    font-size: 20px;
    background-color: rgba(167, 169, 171, 0.09);
    border-radius: 30px;
    color: #58585B;
    letter-spacing: 1.2px;
    line-height: 150%;
    height: 250px;
}
.parg
{
    margin: 20px 200px 20px 20px;
    padding: 20px;
    font-size: 20px;
    color: #58585B;
    letter-spacing: 1.2px;
    line-height: 150%;
}
.matt
{
    background-color: rgba(39, 169, 225, 0.60);
}
.carousel-control.left,.carousel-control.right
{ 
    background-image:none;
}
.pslide
{
    margin-top: 20px;
    font-size: 20px;
    color: white;
    line-height: 150%;
}
.pslidel
{
    padding-left: 120px;
}
.pslider
{
    padding-right: 120px;
}
.pslidebg
{
    
}
.spp
{
    line-height: 250%;
}
.imgslide
{
     padding-right: 120px;
}
.slide
{
    margin-bottom: 50px;
}
.carousel-indicators
{
    bottom: -30px;
}
.titlee
{
    margin-top: 40px;
    margin-left: 20px;
    color:#7AAEDE;
}
.pbig
{
    font-size: 22px;
    line-height: 160%;
}
.contactus
{
    background-color: rgba(39, 169, 225, 0.60);
    padding: 40px 0px 10px 0px ;
}
.contactimg
{
    margin: 20px 0px 10px 0px;
}
.contacttext
{
    display: block;
    text-align: left;
    margin-left: 240px;
    color:white;
}
.ptext
{
    font-size: 16px;
}
.atext,.atext:hover
{
    text-decoration: none;
    color: white;
}
.rfoo,.lfoo
{
    color: #58585B;
}
.afoo,.afoo:hover
{
    color: rgba(60, 198, 244, 0.80);
    text-decoration: none;
}
.navbar-toggle
{
    margin-right: 30px;
}
@media screen and (max-width: 800px)
{
    .logo
    {
        margin: 20px 0px 0px 20px;
    }
    .pargl
    {
        margin: 20px;
        padding: 20px;
        font-size: 14px;
        border-radius: 20px;
        height: auto;
    }
    .pargr
    {
        margin: 20px;
        padding: 20px;
        font-size: 14px;
        border-radius: 20px;
        height: auto;
    }
    .pslide
    {
        padding-left: 20px;
        padding-right: 20px;
        font-size: 14px;
        line-height: 100%;
    }
    .pslidel
    {
        padding-left: auto;
    }
    .pslider
    {
        padding-right: auto;
    }
    .imgslide
    {
        padding-right: 10px;
    }
    .spp
    {
        line-height: 120%;
    }
    #carousel-matt .carousel-indicators
    {
        bottom: -20px;
    }
    .carousel-indicators
    {
        bottom: 20px;
    }
    .titlee
    {
        margin-top: 10px;
        margin-left: 0px;
        color:rgba(128, 130, 132, 0.70);
        text-align: center;
        font-size: 18px;
    }
    .pbig
    {
        font-size: 16px;
        line-height: 140%;
    }
    .parg
    {
        margin: 20px;
        padding: 20px;
        font-size: 14px;
        line-height: 120%;
    }
    .contactimg
    {
        margin: 20px 0px 5px 0px;
    }
    .contacttext
    {
        text-align: center;
        margin-left: 0px;
    }
    }
    .imgslidem
    {
        padding: 0px;
        margin: 0px;
    }

@media handheld, only screen and (max-width: 780px) 
{
    nav
    {
        width: 100%;
        margin: 0px;
    }
    .rfoo
    {
        text-align: left;
    }
}
@media handheld, only screen and (min-width: 780px) 
{
    nav
    {
        width: 780px;
        margin: 40px auto 0px auto;
    }
    #mynavbar
    {
        border-radius: 15px;
    }
    #bs-example-navbar-collapse-1
    {
        border-radius: 15px;
    }
    #bs-example-navbar-collapse-1 > ul > li:nth-child(1) > a:hover
    {
        background-image: url(../img/MattLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #bs-example-navbar-collapse-1 > ul > li:nth-child(2) > a:hover
    {
        background-image: url(../img/pillowLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #bs-example-navbar-collapse-1 > ul > li:nth-child(3) > a:hover
    {
        background-image: url(../img/DkCoLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #bs-example-navbar-collapse-1 > ul > li:nth-child(4) > a:hover
    {
        background-image: url(../img/foamlogoobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #bs-example-navbar-collapse-1 > ul > li:nth-child(5) > a:hover
    {
        background-image: url(../img/syriaLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 85%;
    }
    #a1.anow
    {
        background-image: url(../img/MattLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #a2.anow
    {
        background-image: url(../img/pillowLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #a3.anow 
    {
        background-image: url(../img/DkCoLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #a4.anow
    {
        background-image: url(../img/foamlogoobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 60%;
    }
    #a5.anow
    {
        background-image: url(../img/syriaLogobg.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 85%;
    }
    .rfoo
    {
        text-align: right;
    }
}
@media handheld, only screen and (min-width: 1024px) 
{
    .slidemo{
        display: none;
    }
@media handheld, only screen and (max-width: 1024px) 
{
    .slidemo{
        display: block;
    }
}