.top-header{
  border-top: 2px #fd7802 solid;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
  background-color: #ccc;
  background: url(../images/top-header.jpg) no-repeat;
  background-attachment: cover;
}
.logo-img{
  margin: 0px 40px;
}
.forget-text{
    text-align:right !important;
    margin-bottom:10px !important;
    margin-top:-15px !important;
}
.no-border a{
    border-right:none !important;
}
.gallery-head3{
  margin-left: 15px;
  margin-top: 40px;
  margin-bottom: 40px;
}
.gallery-head3 h2{
  padding: 10px 40px;
  background-color: #28d;
  color: #fff;
  width: 40%;
   /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: width;
    -webkit-transition-duration: 2s;
    -webkit-transition-timing-function: linear;
    -webkit-transition-delay: 1s;
    /* Standard syntax */
    transition-property: width;
    transition-duration: 1s;
    transition-timing-function: linear;
    transition-delay: 0s;

}
.gallery-head3 h2:hover{
  width: 98%;
  cursor: pointer;
  background-color: #fd7802;
}

.gallery-head5 {
    margin-left: 30px;
    margin-top: 40px;
    margin-bottom: 40px;
}

    .gallery-head5 h2 {
        padding: 10px 20px;
        background-color: #28d;
        color: #fff;
        width: 30%;
        /* For Safari 3.1 to 6.0 */
        -webkit-transition-property: width;
        -webkit-transition-duration: 2s;
        -webkit-transition-timing-function: linear;
        -webkit-transition-delay: 1s;
        /* Standard syntax */
        transition-property: width;
        transition-duration: 1s;
        transition-timing-function: linear;
        transition-delay: 0s;
    }

        .gallery-head5 h2:hover {
            width: 99%;
            cursor: pointer;
            background-color: #fd7802;
        }
.gallery-head{
  margin-left: 16px;
  margin-top: 40px;
  margin-bottom: 9px;
}
.gallery-head h2{
  padding: 10px 40px;
  background-color: #28d;
  color: #fff;
  width: 30.5%;
   /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: width;
    -webkit-transition-duration: 2s;
    -webkit-transition-timing-function: linear;
    -webkit-transition-delay: 1s;
    /* Standard syntax */
    transition-property: width;
    transition-duration: 1s;
    transition-timing-function: linear;
    transition-delay: 0s;

}
.gallery-head h2:hover{
  width: 98.2%;
  cursor: pointer;
  background-color: #fd7802;
}

.gallery-head4 {
    margin-left: 36px;
    margin-top: 40px;
    margin-bottom: 9px;
}

    .gallery-head4 h2 {
        padding: 10px 40px;
        background-color: #28d;
        color: #fff;
        width: 28.5%;
        /* For Safari 3.1 to 6.0 */
        -webkit-transition-property: width;
        -webkit-transition-duration: 2s;
        -webkit-transition-timing-function: linear;
        -webkit-transition-delay: 1s;
        /* Standard syntax */
        transition-property: width;
        transition-duration: 1s;
        transition-timing-function: linear;
        transition-delay: 0s;
    }

        .gallery-head4 h2:hover {
            width: 99%;
            cursor: pointer;
            background-color: #fd7802;
        }


.gallery-head1{
  margin-left: 14px;
  margin-top: 40px;
  margin-bottom: 40px;
}
.gallery-head1 h2{
  padding: 10px 40px;
  background-color: #28d;
  color: #fff;
  width: 30%;
   /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: width;
    -webkit-transition-duration: 2s;
    -webkit-transition-timing-function: linear;
    -webkit-transition-delay: 1s;
    /* Standard syntax */
    transition-property: width;
    transition-duration: 1s;
    transition-timing-function: linear;
    transition-delay: 0s;

}
.gallery-head1 h2:hover{
  width: 50%;
  cursor: pointer;
  background-color: #fd7802;
}

.gallery-head2{
  margin-left: 14px;
  margin-top: 40px;
  margin-bottom: 40px;
}
.gallery-head2 h2{
  padding: 10px 40px;
  background-color: #28d;
  color: #fff;
  width: 31.5%;
   /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: width;
    -webkit-transition-duration: 2s;
    -webkit-transition-timing-function: linear;
    -webkit-transition-delay: 1s;
    /* Standard syntax */
    transition-property: width;
    transition-duration: 1s;
    transition-timing-function: linear;
    transition-delay: 0s;

}
.gallery-head2 h2:hover{
  width: 81.8%;
  cursor: pointer;
  background-color: #fd7802;
}



/**
 * 01/28/2016
 * This pen is years old, and watching at the code after all
 * those years made me fall from my chair, so I:
 * - changed all IDs to classes
 * - converted all units to pixels and em units
 * - changed all global elements to classes or children of
 *   .login
 * - cleaned the syntax to be more consistent
 * - added a lot of spaces that I so hard tried to avoid
 *   a few years ago
 *   (because it's cool to not use them)
 * - and probably something else that I can't remember anymore
 *
 * I sticked to the same philosophy, meaning:
 * - the design is almost the same
 * - only pure HTML and CSS
 * - no frameworks, preprocessors or resets
 */

/* 'Open Sans' font from Google Fonts */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);


.login {
  margin: 16px auto;
  font-size: 16px;
}

/* Reset top and bottom margins from certain elements */
.login-header,
.login p {
  margin-top: 0;
  margin-bottom: 0;
}

/* The triangle form is achieved by a CSS hack */
.login-triangle {
  width: 0;
  margin-right: auto;
  margin-left: auto;
  border: 12px solid transparent;
  border-bottom-color: #28d;
}

.login-header {
  background: #28d;
  padding: 16px;
  font-size: 1.4em;
  font-weight: normal;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.login-container {
  background: #ebebeb;
  padding: 12px;
}

/* Every row inside .login-container is defined with p tags */
.login p {
  padding: 2px;
}

.login input {
  box-sizing: border-box;
  display: block;
  width: 100%;
  border-width: 1px;
  border-style: solid;
  padding: 16px;
  outline: 0;
  font-family: inherit;
  font-size: 0.95em;
}

.login input[type="email"],
.login input[type="password"] {
  background: #fff;
  border-color: #bbb;
  color: #555;
}

/* Text fields' focus effect */
.login input[type="email"]:focus,
.login input[type="password"]:focus {
  border-color: #888;
}

.login input[type="submit"] {
  background: #28d;
  border-color: transparent;
  color: #fff;
  cursor: pointer;
}

.login input[type="submit"]:hover {
  background: #17c;
}

/* Buttons' focus effect */
.login input[type="submit"]:focus {
  border-color: #05a;
}

.test-text h3{
  font-size: 20px;
  font-weight: bold;
  line-height: 30px;
}
.test-text p{
  line-height: 30px;

}

.test-text{
  margin-left: 20px;
  border: 1px #ccc solid;
}

input[type=text], select, textarea {
    width: 100%;
    padding: 3px 10px !important;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
}
.login input {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border-width: 1px;
    border-style: solid;
    padding: 3px 10px;
    outline: 0;
    font-family: inherit;
    font-size: 0.95em;
}










#accordion .panel {
  border-radius: 0;
  border: 0;
  margin-top: 0px;
}
#accordion a {
  display: block;
  padding: 10px 15px;
  border-bottom: 1px solid #b42b2b;
  text-decoration: none;
  color: #fff;
  background-color: #cf4040;
}
#accordion .panel-heading a.collapsed:hover,
#accordion .panel-heading a.collapsed:focus {
  background-color: #fd7802;
  color: white;
  transition: all 0.2s ease-in;
}
#accordion .panel-heading a.collapsed:hover::before,
#accordion .panel-heading a.collapsed:focus::before {
  color: white;
}
#accordion .panel-heading {
  padding: 0;
  border-radius: 0px;
  text-align: center;
}
#accordion .panel-heading a:not(.collapsed) {
  color: white;
  background-color: #b42b2b;
  transition: all 0.2s ease-in;
}

/* Add Indicator fontawesome icon to the left */
#accordion .panel-heading .accordion-toggle::before {
  font-family: 'FontAwesome';
  content: '\f00d';
  float: left;
  color: white;
  font-weight: lighter;
  transform: rotate(0deg);
  transition: all 0.2s ease-in;
}
#accordion .panel-heading .accordion-toggle.collapsed::before {
  color: #fff;
  transform: rotate(-135deg);
  transition: all 0.2s ease-in;
}
.gallery-section{
  background-color: #f5f5f0;
  margin-bottom: 50px;
}
.fotter{
  background-color: #3a3737;
  padding: 30px 0;
  margin-top: 40px;
  color: #fff;
}

.panel-group .panel-heading+.panel-collapse>.list-group, .panel-group .panel-heading+.panel-collapse>.panel-body {
    border: 2px solid #b42b2b;
}



.about-section h3{
  position: absolute;
  top:14%;
  font-size: 45px;
  color: #fff;
  margin-left: 25%;
  text-align: center !important;
}
.gallery-section p{
  margin-top: 0px;
  font-size: 16px;
  line-height: 32px;
  text-align: justify;
}
.about-img-section p{
  font-size: 14px;
  margin-top: 10px;
  text-align: left;
  line-height: 20px;
}
.about-img-section h4{
  font-size: 18px;
  margin-top: 12px;
  font-weight: bold;
}
.about-img-section span{
  font-size: 15px;margin-top: 10px;
  margin-bottom: 20px;
  font-weight: bold;
}
.content-img{
  box-shadow: 0 0 3px 2px #d4d3d3;
}
.content-img:hover{
  background-color: #a1ccf0;
}

.btn-primary {
    color: #fff;
    padding: 13px 111px;
    background-color: #cf4040;
    border-color: #cf4040;
}
.btn-primary:hover {
    color: #fff;
    background-color: #fd7802!important;
    border-color: #fd7802!important;
}
.btn-primary.focus, .btn-primary:focus {
    color: #fff;
    background-color: #cf4040;
    border-color: #cf4040;
}
input[type=submit] {
    background-color: #4CAF50;
    color: white;
    padding: 15px 50px !important;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.contact-text h3{
  font-size: 24px;
  font-weight: bold;
}
.contact-text p{
  margin-top: 30px;
  line-height: 33px;
  font-size: 16px;
  text-align: left;
}
.about-last-text{
    margin-left:20px;
    margin-top:20px !important;
}
.works-img {
    box-shadow: 0 0 3px 2px #191515;

}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 0.01rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: hidden !important;
    border-radius: .25rem;
}
.sidebar .nav-item .dropdown-menu {
    position: static !important;
     margin: 0 2rem;
    top: 0;
}